Mobile

Touch Target Size Calculator

Measure interactive targets against the WCAG 2.2 AA minimum (24×24 CSS px) and AAA enhanced (44×44) requirements.

Live sizer

Analyze HTML

Paste markup with inline sizes (attributes or style) to batch-audit targets.

Paste your HTML

Editorial guidance

How this mobile tool supports accessibility work

The touch target size calculator is designed to turn a common accessibility review task into a repeatable workflow. It focuses on wcag 2.5.8 24×24 minimum and 2.5.5 44×44 target checker with live measurement. The goal is not to replace expert judgment, but to make the first review faster, more consistent, and easier to explain to designers, developers, QA teams, and content owners.

Use the output as evidence for a remediation conversation. A failed check normally means the implementation needs a closer look against WCAG 2.5.5, 2.5.8, while a passing check means the specific automated rule did not find a problem. Passing automated checks is helpful, but it is not the same as a full conformance claim.

For best results, test real production markup instead of simplified snippets. Templates, CSS state, JavaScript behavior, responsive layouts, and content changes can all affect the final accessibility experience. Re-run the tool after fixes so the before-and-after evidence is easy to compare.

Pair this tool with manual keyboard testing, zoom and reflow checks, screen-reader review, and content judgment. Those human checks catch issues that automated logic cannot reliably infer, such as whether labels are meaningful, instructions are clear, or a complete user task can be finished without a mouse.

How to use

  1. 1Enter the width and height of the touch target you are designing or inspecting.
  2. 2Compare the measured result against the 24 by 24 and 44 by 44 guidance shown by the calculator.
  3. 3Increase the clickable area or spacing when controls are too small for reliable mobile interaction.

FAQs

Tips here are tailored for the touch target size calculator so people can move from checking to fixing faster.

What to verify manually

Keyboard: move through the related flow with Tab, Shift+Tab, Enter, Space, Escape, and arrow keys where the pattern expects them.

Assistive technology: check names, roles, states, reading order, announcements, and focus changes with at least one screen reader.

Content quality: confirm that instructions, labels, headings, errors, and alternatives make sense in the real user task.

This page is written as practical guidance, not a legal certification. For procurement, VPAT/ACR work, or regulated launches, combine tool output with expert review and documented manual test results.

We use essential browser storage to remember your preferences. If advertising or analytics is enabled, you can choose whether to allow those non-essential technologies. Read our Cookie Policy and Privacy Policy.