• Success Criterion 2.4.7
  • Conformance level AA

Focus Indicator That Disappears in Windows High Contrast Mode

2.4.7 — Focus Visible

Scenario

Setting

A community forum's discussion thread

What’s wrong

Indicator removed on Windows High Contrast / forced-colors mode via outline: none + box-shadow trick (box-shadow stripped by forced colors).

Example

button:focus { outline: none; }

Why it matters

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

How to test

Enable Windows High Contrast / forced-colors mode and Tab through the page: if outline:none plus a box-shadow trick was used for the indicator, forced-colors mode strips the box-shadow too, leaving nothing visible.

How to fix

A clearly visible focus indicator must appear, in full, on every interactive element when it receives keyboard focus. button:focus-visible { outline: 2px solid #1a73e8; outline-offset: 2px; } Removing the focus outline with no replacement makes it impossible to see which element has keyboard focus.

Outcome

On a community forum's discussion thread, this barrier is gone for sighted keyboard users and low-vision users who must see where focus is — they get the same result as anyone else here.

Who is affected

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

Learn more