Target size quiz
Target size practice
Swipe right if it passes WCAG, left if it fails. Or use the buttons or your arrow keys.
The rule in plain words
WCAG 2.5.8 Target Size (Minimum)
Things people tap or click need to be big enough to hit without hitting the neighbor. That matters for tremors, large fingers, and everyone on a bumpy train.
Targets should be at least 24 by 24 CSS pixels. Smaller targets can still pass if a 24 px circle centered on each one does not touch another target or its circle.
| What | Needs |
|---|---|
| Minimum, Level AA (2.5.8) | 24 × 24 px |
| Enhanced, Level AAA (2.5.5) | 44 × 44 px |
Exceptions people miss
- Spacing: undersized targets that are far enough apart.
- Inline: links inside a sentence or paragraph.
- Equivalent: the same action is available from a big enough control on the same page.
- Browser controls the site did not restyle, and cases where the size is essential.
Common mistakes
- Icon toolbars with 16 to 18 px buttons packed edge to edge.
- Carousel dots of 8 px with a few pixels between them.
- Edit and delete icons squeezed together on every table row.
- Tiny stacked up and down arrows on quantity inputs.
Your turn
Is your own site accessible or not?
Axeazy scans your real pages for WCAG issues like the ones in this deck and opens code fixes, not an overlay. Free scan in 60 seconds, no credit card.
Questions
Target size, answered
What is the minimum target size in WCAG 2.2?
24 by 24 CSS pixels at Level AA, with exceptions for spacing, inline links, equivalent controls, unstyled browser controls and essential cases.
Is 44 px required?
Only for Level AAA (2.5.5). It is still a great default, and it matches common mobile platform guidance.
Do links in a paragraph need to be 24 px tall?
No. Links inside a sentence are exempt because their size depends on the text around them.