Understanding Success Criterion 2.4.12: Focus Appearance (Enhanced)

Success Criterion 2.4.12 Focus Appearance (Enhanced) (Level AAA): When user interface components have keyboard focus, all of the following are true:




The purpose of this success criterion is to ensure a keyboard focus indicator is highly visible. This criterion is closely related to Success Criterion 2.4.11 Focus Appearance (Minimum) and defines a higher level of visibility for the focus indicator.

In relation to Focus Visible (enhanced) this criterion:

The other aspects of the success criterion are the same as Focus Visible (Minimum).


The benefits of this success criterion are similar to Focus Appearance (Minimum).


The examples of this success criterion are similar to Focus Appearance (Minimum).



Sufficient Techniques

@@@ Create a new techniques based on:

  3. C41: Creating a strong focus indicator within the component



Key Terms

css pixel

visual angle of about 0.0213 degrees


focus indicator


minimum bounding box

the smallest enclosing box within which all the points of a shape lie. Where a component consists of disconnected parts, such as a link that wraps onto multiple lines, each part is considered to have its own bounding box.


continuous line forming the boundary of a shape not including shared pixels, or the minimum bounding box of a complex shape, whichever is shortest. For example, the perimeter calculation for a rectangle is 2h+2w -4, where h is the height and w is the width and the corners are not counted twice. The perimeter of a circle is 2𝜋r.

user interface component







