Success Criterion 2.4.7
Conformance level AA

2.4.7 · Focus Visible

Lesson overview · Focus Visible

In plain language

Keyboard focus must always be visible.

Who it affects

Sighted keyboard users and low-vision users who must see where focus is.

How to check

Tab through every page: at every stop you must clearly see which element is focused.

Common misconception

A subtle color change on focus (like a slightly darker button) often passes a casual glance but fails in practice, because it's too faint to notice, especially for low-vision users.

Learn more

Understanding Understanding this success criterion (opens in a new tab)

Scenarios in this lesson

Element Losing Keyboard Focus the Instant It’s Reached
Focus Outline Removed by CSS With No Replacement
Global CSS Reset Removing Every Focus Outline Site-Wide
Focus Indicator Styled for Some Components but Not Others
Focus Indicator That’s Just a Subtle, Hard-to-See Color Shift
Focus Style That Only Appears on Hover, Never on Tab Focus
Focus Indicator Hidden Behind an Overlapping Sticky Element
Keyboard Focus Landing on an Unstyled, Invisible Target
Focus-Visible Polyfill Misconfigured to Show Nothing at All
Focus Indicator That Disappears in Windows High Contrast Mode
Focus Indicator That’s Only Partially Visible When Clipped