Focus Appearance (Minimum)

AA

New

When a user interface component has keyboard focus, the focus indicator:

• Encloses the visual presentation of the user interface component;
• Has a contrast ratio of at least 3:1 between its pixels in the focused and unfocused states;
• Has a contrast ratio of at least 3:1 against adjacent colors.

Exceptions:

• The focus indicator is determined by the user-agent and cannot be adjusted by the author, or
• The focus indicator and the indicator's background color are not modified by the author, or
• An area of the focus indicator meets all the following:
  • At least as large as the area of a 1 CSS pixel thick perimeter of the unfocused component, or is at least as large as a 4 CSS pixel thick line along the shortest side of the minimum bounding box of the unfocused component, and
  • has a contrast ratio of at least 3:1 against the same pixels in the unfocused state, and
  • has a contrast ratio of at least 3:1 against adjacent non-focus-indicator colors, or is no thinner than 2 CSS pixels.

Where a user interface component has active sub-components (for example, an opened drop-down menu shows a list of menu items), if the focus indicator is applied to the sub-component then these requirements can be applied to the sub-components instead.