outline: none has locked more keyboard users out of the web than any other two words of CSS.
The ring is the cursor
A keyboard user without a visible focus indicator is a mouse user without a pointer. Every interactive element in this theme carries a 2.4px ring that passes 3:1 against its background.
WCAG 2.2 raised the bar
Focus must now also stay unobscured — sticky headers and cookie banners may not hide the focused element. We test with the header pinned and the page scrolled, not just at the top.
Design the ring, do not delete it
If the default outline clashes with your brand, style it — thicker, offset, in your palette. Deleting it because it is “ugly” hands the bill to your users.
