WCAG 2.5.5: Target Size (Enhanced)
Small targets punish anyone whose pointer is not pixel-precise — fingers on phones, hands with tremor, styluses on the move. This criterion sets the comfortable standard: every pointer target is at least 44 by 44 CSS pixels, with four narrow exceptions. It is the AAA counterpart to 2.5.8’s 24px minimum — same idea, ergonomic size.
The success criterion, in full
The size of the target for pointer inputs is at least 44 by 44 CSS pixels except when:
Equivalent: The target is available through an equivalent link or control on the same page that is at least 44 by 44 CSS pixels;
Inline: The target is in a sentence or block of text;
User Agent Control: The size of the target is determined by the user agent and is not modified by the author;
Essential: A particular presentation of the target is essential to the information being conveyed.
Note what is not in this list: a spacing exception. Unlike 2.5.8, generous gaps between small targets do not help here — the target itself must measure 44×44 unless one of the four exceptions applies.
Who this helps and why
44 CSS pixels is roughly the contact patch of an adult fingertip. Targets smaller than that demand precision many users simply do not have — and every miss costs a correction, an accidental activation of the neighbouring control, or an abandoned task.
People with motor disabilities
Tremor, spasticity, limited dexterity, or fatigue make fine pointing slow and error-prone. Large targets convert near-misses into hits.
Touchscreen users generally
Fingers are blunt instruments and occlude what they touch. The 44px figure matches Apple's 44pt and is close to Android's 48dp guidance for exactly this reason.
Older users
Age-related declines in fine motor control and vision compound: small targets are both harder to see and harder to hit.
Anyone in real-world conditions
A phone in one hand on a moving train, a stylus with gloves, a trackpad on a bumpy flight — situational impairments make every user a low-precision user sometimes.
The four exceptions, in practice
Equivalent
A small target is fine if the same action is available through another target on the same page that does meet 44×44. Example: a tiny 'x' on each tag chip, plus a full-size 'Clear all filters' button. The small path is a convenience; the accessible path exists.
Inline
Links inside a sentence or block of text are exempt — their height is set by the line, and inflating them to 44px would destroy the typography. This covers body-copy links only; standalone links merely positioned near text do not qualify.
User Agent Control
Native controls rendered at the browser's default size — an unstyled checkbox, radio button, or select — are exempt as long as your CSS has not modified their size. Style them, and you own their dimensions.
Essential
When the specific presentation is legally or informationally required. The classic case is map pins: enlarging them to 44px would misrepresent the precise locations they mark. Density preferences and visual taste are not 'essential'.
2.5.5 vs 2.5.8: comfort vs floor
2.5.8 Target Size (Minimum) — AA
24×24 CSS px minimum, added in WCAG 2.2. Includes a spacing exception: smaller targets can pass if a 24px circle centred on each does not intersect another target or its circle. Also excepts inline, user-agent, essential — plus equivalent controls.
2.5.5 Target Size (Enhanced) — AAA
44×44 CSS px — nearly four times the area of a 24px square. Same exception structure minus the spacing offset: the target itself must reach 44px unless it is equivalent, inline, user-agent controlled, or essential.
Practical framing: 2.5.8 keeps interfaces from being actively hostile; 2.5.5 makes them comfortable. Related pointer criteria round out the guideline — 2.5.7 Dragging Movements covers gestures that need an alternative, and 2.5.2 Pointer Cancellation covers aborting an accidental press — which large targets make rarer in the first place.
Code examples
Give controls a 44px minimum box
Use min-width/min-height so content can grow the control but never shrink it below the target size.
/* ✗ Icon button sized to its 20px glyph */
.icon-button { width: 20px; height: 20px; }
/* ✓ Compact glyph, ergonomic target */
.icon-button {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 44px;
min-height: 44px; /* hit area, not icon size */
}
.icon-button svg { width: 20px; height: 20px; }Extend the hit area without changing the design
Where layout is tight, an invisible pseudo-element enlarges the clickable region while the visual footprint stays small.
/* ✓ 24px visual chip, 44px effective target */
.tag-remove {
position: relative;
width: 24px;
height: 24px;
}
.tag-remove::after {
content: "";
position: absolute;
inset: -10px; /* 24 + 10 + 10 = 44px each axis */
}Make the whole row the target, not just the text
In menus and lists, put the padding on the link itself — padding on the surrounding li looks identical but is not clickable.
/* ✗ 16px-tall link floating in a tall row */
.nav li { padding: 14px 16px; }
.nav a { /* target = text height only */ }
/* ✓ The link fills the row: full 44px+ target */
.nav li { padding: 0; }
.nav a {
display: block;
padding: 14px 16px; /* 16px text + 28px padding ≥ 44px */
}Common failures
- Icon-only buttons sized to their glyph — 16–24px close buttons, kebab menus, and toolbar icons with no padding.
- Tappable table-row actions (edit/delete icons) packed at 20px in dense data grids with no equivalent full-size control.
- Pagination and stepper controls: '‹ 1 2 3 ›' links a dozen pixels wide, adjacent to each other.
- Checkboxes and radios restyled to a decorative 16px box — restyling voids the user-agent exception while keeping the tiny size.
- Padding placed on non-interactive wrappers so the row looks large but only the text is clickable.
- Carousel dots, tag-remove crosses, and video player controls at mobile sizes far below 44px.
- Counting whitespace between targets as if it were target size — spacing helps 2.5.8's exception but does nothing for 2.5.5.
- Claiming the 'essential' exception for what is really a visual-density preference.
How to test for 2.5.5
- 1
Inventory every pointer target
Buttons, links, form controls, custom widgets, media controls, chips, dots, and icons — anything that responds to a click or tap is in scope, on every breakpoint you serve.
- 2
Measure the interactive box, not the artwork
In DevTools, hover each element and read the layout box dimensions, or select it and check the computed width/height including padding. The question is the clickable region's size — a 20px icon in a 44px button passes.
- 3
Flag anything under 44×44 CSS pixels
Both dimensions must reach 44. A 60×32 button fails on height. Automated tools (axe's target-size rules, Lighthouse's tap-target audit) catch many cases; verify their pixel math in DevTools for custom components.
- 4
Apply the exceptions deliberately
For each flagged target ask, in order: is a 44px equivalent control on the same page? Is it a link inside a sentence or text block? Is it an unmodified native control? Is the small presentation truly essential? Only a yes to one of these clears it.
- 5
Sanity-check with a real thumb
On an actual phone, work through the key flows using one thumb. Repeated mis-taps are the human signal that a target that 'measures fine' is still too small or too crowded in context.
Measure once, fix globally: a design-token minimum for interactive elements clears most failures in one change. Track the pointer criteria together in the WCAG 2.2 checklist.
Frequently asked questions
What does WCAG 2.5.5 Target Size (Enhanced) require?
It requires that the size of the target for pointer inputs is at least 44 by 44 CSS pixels, unless one of four exceptions applies: Equivalent (the same action is available through another target on the same page that is at least 44x44), Inline (the target is in a sentence or block of text), User Agent Control (the size is determined by the browser and not modified by the author), or Essential (a particular presentation of the target is essential to the information being conveyed). It is a Level AAA criterion under Guideline 2.5 Input Modalities, introduced in WCAG 2.1.
How is 2.5.5 different from 2.5.8 Target Size (Minimum)?
2.5.8 (Level AA, new in WCAG 2.2) is the smaller, more lenient floor: targets must be at least 24 by 24 CSS pixels, and an undersized target can also pass through a spacing offset — if targets are far enough apart, they may be smaller than 24px. 2.5.5 (Level AAA) nearly doubles the linear size to 44 by 44 CSS pixels and has no spacing escape hatch: the target itself must be 44x44 unless it is equivalent, inline, user-agent controlled, or essential. The exception lists are otherwise structured the same way.
Does the 44px minimum include padding around the visible control?
The target is the region that accepts the pointer action, not just the painted pixels. If a 24x24 icon sits inside a button whose clickable area — including padding — measures 44 by 44 CSS pixels, the target passes. This is the standard fix: keep the visual design compact while extending the hit area with padding, min-width/min-height, or a pseudo-element. What does not count is empty space that is not clickable: visual breathing room around a small link does nothing for its target size.
What does the Inline exception cover?
Links that occur within a sentence or block of text are exempt, because their size is rightly governed by the text's font size and forcing them to 44px would wreck line spacing. A 'read the full policy' link inside a paragraph does not need to be 44px tall. The exception applies only to genuinely in-flow text links: a standalone link styled as a row of navigation, or an icon dropped between paragraphs, is not 'in a sentence' and must meet the size requirement.
What are CSS pixels, and how do they relate to physical size?
A CSS pixel is the unit your stylesheets use, which the browser scales for device pixel density and zoom — it is not a hardware pixel. 44 CSS pixels corresponds roughly to 9–10mm on a typical mobile display at default zoom, which matches the physical size of a fingertip press. This is also why the value echoes platform guidance: Apple's Human Interface Guidelines recommend 44x44 pt touch targets and Android Material Design recommends 48x48 dp — WCAG 2.5.5 encodes the same ergonomics as a testable web standard.
Is 2.5.5 required for compliance if I already meet 2.5.8?
No — legal baselines reference Level AA, which includes 2.5.8's 24px minimum, not the AAA 44px rule. But 24px is a floor, not a comfort target: research on touch accuracy and every major platform's design guidance converge on the 44–48px range for reliable one-finger use. Teams building touch-heavy interfaces, products for older users, or anything used on the move (kiosks, transit apps, medical devices) frequently adopt 44px as their working standard and treat 24px as the never-go-below line.
Related Success Criteria
Functionality that uses multipoint or path-based gestures has alternatives.
Functions triggered by single pointer can be cancelled or undone.
The accessible name contains the visible label text.
Functionality triggered by device motion can be disabled and has alternatives.
Content does not restrict use of input modalities.