Minimum Size
| Severity | Serious |
|---|---|
| Accessibility Principle | Operable |
| Affected users | Visual, Mobility |
| Success criterion | 2.5.5 |
Touch targets — buttons, links, and any other tappable element — must be large enough for users to tap accurately. Users with motor impairments, tremors, or limited dexterity are most affected by targets that are too small. Platform guidelines set the minimum:
- iOS: 44×44 pt (Apple Human Interface Guidelines)
- Android: 48×48 dp (Google Accessibility)
AMA enforces these minimums automatically for tappable components at development time.
Expectations
- When: A screen reader user activates an element
- Then: Screen readers use swipe to navigate and double-tap anywhere to activate — minimum touch size is less critical for screen reader navigation, but elements must still be large enough for the double-tap gesture to register reliably
- When: Voice Control displays number overlays on interactive elements
- Then: Elements that are too small may have overlapping or illegible number labels — adequate size ensures overlay numbers are readable and non-overlapping
hitSlop vs min size
AMA prefers forcing a minimum size check instead of using hitSlop; as with the latter, the hit area is never extended beyond the parent boundaries:
The touch area never extends past the parent view bounds, and the Z-index of sibling views always takes precedence if a touch hits two overlapping views.
https://reactnative.dev/docs/touchablewithoutfeedback#hitslop
So, if the parent width or height is less than 44 or 48px, the touch area will not meet the minimum requirement. In contrast, min-width and min-height forces the component to have the minimum size preferred.
Best Practices
Use minWidth and minHeight rather than hitSlop
hitSlop cannot extend beyond the parent view bounds, so it silently fails when the parent is too small. Set minWidth and minHeight directly on the element to guarantee the physical size.
<Pressable style={{ minWidth: 44, minHeight: 44 }} onPress={onPress}>
<Icon />
</Pressable>
Add spacing between closely packed targets
Two adjacent targets that individually meet the minimum size can still be hard to use if they are touching. Add padding or margin between elements so an inaccurate tap on one does not accidentally activate the other.
Use AMA components to get the check for free
AMA's pressable components enforce the minimum size requirement at development time and log an error when it is violated. Prefer them over building custom touchables that require manual size verification.
The Log level type can be customised, here for more info
AMA dev runtime errors
MINIMUM_SIZE
This error is used when a touchable area is less than 44x44px on iOS or 48x48dp on Android.