How to fix: invisible focus indicator

What it looks like in the wild

Tabbing through the page shows nothing about which element has focus.

The screen-reader user, keyboard user, or low-vision user encountering this issue does not get an error message. The page just stops working for them. Which is why this kind of bug rarely shows up in your error tracker; it shows up in support tickets, lawsuits, and abandoned conversions.

Why it fails WCAG

outline:none without a replacement removes the indicator entirely.

The wrong pattern (avoid)

*:focus { outline: none; }

The right pattern (copy this)

:where(button, a, input, [tabindex]):focus-visible {
  outline: 2px solid #0891b2;
  outline-offset: 2px;
}

Notes from real audits

• :focus-visible avoids the ring on mouse click, keeps it for keyboard.

How to verify the fix

Shipping the change is not the same as passing 2.4.7. Re-run these checks against the page you edited before you close the ticket.

• Tab through the page in default browser styles, then in your CSS — the indicator must remain visible.

What 2.4.7 requires

2.4.7 Focus Visible (Level AA, Operable): Any keyboard-operable interface must have a visible indicator showing which element has focus. Removing the default focus outline is one of the most common style "improvements" — and one of the most damaging accessibility regressions. Without focus visibility, keyboard users cannot tell where they are on the page.

• outline: none with no replacement

  2.4.7

• Focus indicator below 3:1 contrast

  2.4.7

Priority: Serious

This is one of the findings that shows up in demand letters, because the barrier it creates is total rather than inconvenient: the affected user cannot complete the task at all. Treat it as a release blocker, not a backlog item.

Because the cause is almost always a shared component rather than a single page, fix it where the component is defined and re-scan the whole site. Record 2.4.7 on the ticket verbatim: that string is what an auditor, a procurement questionnaire or a regulator will search for.