Operable · Level AA · Introduced in WCAG 2.0
WCAG 2.4.7: Focus Visible
Published by whatisADA / Grow Wild Agency · Updated
What this criterion means
Keyboard users need a visible indicator showing which interactive element currently has focus. The page must have a mode of keyboard operation where that indicator can be seen.
A practical example
A theme removes outlines from all buttons, leaving only a hover color. Add a visible focus style and test it on every button background, including dark cards and destructive actions.
How to check it
- Navigate with Tab and the expected keys for composite widgets.
- Inspect every focused control across default, expanded, selected and error states.
- Check that the indicator remains visible in the relevant themes and is not clipped by overflow containers.
What can be missed
A mouse hover style is not a keyboard focus indicator. WCAG 2.2 also adds criteria for obscuring focus and, at AAA, the indicator's measurable appearance.
Record your test
Use this worksheet to record what you actually checked. Notes stay on this device when you choose Save; they are not sent to us. Avoid personal or confidential information on shared devices.
These are your observations, not automated results or a conformance certificate. A complete evaluation needs appropriate scope, supported technologies, all applicable criteria and relevant page states.
Primary sources and scope
This is independent implementation guidance with original examples. The linked standard contains the full definitions, exceptions and conformance requirements. A criterion or checklist alone does not establish legal applicability or whole-site conformance.