The 24-Pixel Target Size Metric: What WCAG 2.2 Actually Requires

A target of 24 by 24 pixels sounds small until you try to tap a 12-pixel icon on a phone with one hand. WCAG 2.2 made 24 pixels the floor, and most sites fail it on their smallest controls: the close button, the social icon, the pagination number.

The floor is 24, the goal is 44

WCAG 2.2 Success Criterion 2.5.8, Target Size (Minimum), requires that the target for pointer inputs be at least 24 by 24 CSS pixels, at Level AA, with five exceptions. The AAA version, 2.5.5, asks for 44 by 44 pixels. The 24-pixel figure is a floor, not a goal. The practical rule is to build to 44 and test against 24, because a 24-pixel target is passable and a 44-pixel target is usable, and the difference shows up on a phone, with one hand, on a moving train.

The criterion is new in WCAG 2.2, which became a W3C Recommendation in October 2023, and it exists because the failures were so common. Social icons, close buttons on modals, pagination numbers, and inline icon buttons are the usual offenders, and they fail for the same reason: the designer sized the icon, not the target. The icon can be 16 pixels. The target cannot be.

The contrast ratio post made the same point about a different metric: the scanner enforces a number, and the number is a floor, not a design. Target size is the same kind of metric, and it is measured the same way: against the computed size in the browser, not the size in the design file.

The spacing exception is real, and harder than it looks

A target smaller than 24 pixels can still pass if a 24-pixel diameter circle centred on it does not touch another target or another undersized target's circle. That is the spacing exception, and it is legitimate. But it is harder to verify than size, because it needs the geometry of the whole page, not just one element. Most teams find it easier to make the target bigger than to prove the spacing works.

The other exceptions are narrower: links inside a sentence of body text are exempt, targets whose size is set by the browser are exempt, and cases where the size is essential to the function are exempt. A pagination control is not essential at 12 pixels. A close button is not essential at 10. The exceptions cover the cases where a bigger target would break the content, not the cases where a bigger target would inconvenience the design.

The accessible authentication post covered a different WCAG 2.2 addition, and the pattern is the same: the new criteria in 2.2 are the ones teams miss, because they were not in 2.1. Target size is the most common new failure, and it is the easiest to fix.

The fix is padding

Add padding, not a bigger icon. The visible icon can stay small while the clickable area grows, by adding padding to the button element. A 16-pixel icon inside a 24-pixel button passes, and the design does not change. That is the cheapest fix in accessibility, and it works on every control: the close button, the social icon, the pagination number, the quantity stepper.

The test is manual, because most automated scanners do not test target size reliably. Axe, Lighthouse, and WAVE all struggle with it, because the criterion needs layout-aware measurement of computed element sizes and gaps. Measure the computed size of each interactive element in the browser, or use an extension that draws the target boxes. The metric to track is the share of interactive elements that meet 24 pixels, and the goal is 100 percent, because a single failing control can be the one a user needs most.

Frequently asked questions

What is the WCAG 2.2 target size requirement?

WCAG 2.2 Success Criterion 2.5.8, Target Size (Minimum), requires pointer targets to be at least 24 by 24 CSS pixels, with five exceptions. The AAA version, 2.5.5, asks for 44 by 44 pixels. The 24-pixel figure is the AA floor, not the usability target, and the practical rule is to build to 44 and test against 24.

Can a small target pass if it has enough space around it?

Yes, if the spacing exception applies. A target smaller than 24 pixels can still pass if a 24-pixel diameter circle centred on it does not touch another target or another undersized target's circle. Spacing is a legitimate way to pass, but it is harder to verify than size, and most teams find it easier to make the target bigger.

Do automated scanners catch target size failures?

Most scanners do not test it reliably, including axe, Lighthouse, and WAVE, because the criterion needs layout-aware measurement of computed sizes and gaps. The reliable test is a manual one: measure the computed size of each interactive element in the browser, or use a browser extension that draws the target boxes.

Is WCAG 2.2 target size required by US law yet?

No. The US Department of Justice's 2024 Title II rule cites WCAG 2.1 Level AA, which has no target size criterion. The compliance deadlines are April 26, 2027 for governments with a population of 50,000 or more, and April 26, 2028 for smaller ones. Many teams still build to 2.2, because the standard is moving that way and the fix is cheap.