2.4.13 Focus Appearance

What this criterion requires

The focus indicator must be at least as large as a 2 CSS pixel perimeter of the component and have 3:1 contrast between focused and unfocused states.

Who it helps

People with low vision using the keyboard.

Example: fails vs passes

:focus { outline: 1px dotted #888; }

:focus-visible { outline: 3px solid #00c0a8; outline-offset: 2px; }  /* thick and 3:1 against both states */

AAA quantifies the indicator: at least a 2px perimeter, 3:1 change between focused and unfocused.

How to meet and fix it

• Use a thick (2px+), high-contrast outline with an offset; avoid subtle color-only shifts

Common failures auditors find

• 1px hairline or faint glow focus styles

Automated scanning catches a share of these instantly - run a free check - and a manual audit covers the judgement calls a tool cannot make.

Last updated 12 August 2026. Reviewed by the EqualWeb accessibility team.