Fingers need 44×44px minimum; spacing prevents mis-taps.
The guidance#
size-11 (44px) is the minimum icon button; pad smaller visuals with p-*. space-x gaps between adjacent targets. Test on real phones, not desktop devtools emulation.
In markup#
<button class="grid size-11 place-items-center rounded-lg border" aria-label="Menu">☰</button>Checklist#
- Tested with keyboard only
- Screen-reader spot check
- Contrast verified for new pairs
- Reduced-motion behavior confirmed
- Zoomed to 200% without loss
Related#
accessibility/index|Accessibility hub · sr-only