Category: Input and Navigation

Focus Appearance

Also known as: WCAG 2.4.13, Success Criterion 2.4.13

Simply put

Focus Appearance is a web accessibility guideline that addresses how clearly a keyboard focus indicator appears when a user moves through a page using a keyboard. The focus indicator is the visual highlight, such as an outline, that shows which element is currently selected. This guideline aims to make that indicator large enough and distinct enough that keyboard users can easily see where they are on a page.

Formal definition

Focus Appearance is WCAG 2.2 Success Criterion 2.4.13, published at Level AAA by the W3C's Web Accessibility Initiative. It seeks to ensure that the keyboard focus indicator is clearly visible and discernible, going beyond the more general requirement of SC 2.4.7 Focus Visible (a Level AA criterion present since WCAG 2.0) by addressing the size and contrast characteristics of the indicator itself. Because it is a Level AAA criterion, it is generally more stringent than the Level AA target most commonly cited as a conformance goal, and practitioners should not conflate it with the separate SC 2.4.11 Focus Not Obscured (Minimum), which was also introduced in WCAG 2.2 and addresses whether the focused element is hidden by other content. This entry describes the criterion as published and is not legal advice; conformance with a success criterion does not by itself guarantee an accessible experience or legal compliance, and manual and assistive technology testing remain necessary.

Why it matters

Keyboard focus indicators are how sighted users who navigate without a mouse keep track of their position on a page. When a person moves through interactive elements using the Tab key, the focus indicator, such as an outline or highlight, shows which element is currently selected. If that indicator is faint, small, or low in contrast, users can lose track of where they are, making it difficult or impossible to complete tasks like filling out a form or activating a button. Focus Appearance (WCAG 2.2 Success Criterion 2.4.13, Level AAA) addresses this by focusing on the size and contrast characteristics of the indicator itself, going beyond the more general visibility requirement of SC 2.4.7 Focus Visible.

As a Level AAA criterion, Focus Appearance is generally more stringent than the Level AA target most commonly cited as a conformance goal. Organizations aiming primarily at AA conformance may still meet SC 2.4.7 Focus Visible without fully satisfying 2.4.13, but adopting the stronger criterion can meaningfully improve usability for keyboard users, including people with low vision or cognitive disabilities who benefit from a clearer, more discernible indicator. Because focus guidance shows users what is clickable and helps identify what an element is, a well-designed indicator supports orientation and confidence throughout an interaction.

Practitioners should not confuse 2.4.13 with the separate SC 2.4.11 Focus Not Obscured (Minimum), which was also introduced in WCAG 2.2 but addresses whether a focused element is hidden by other content rather than how the indicator looks. Meeting this or any single success criterion does not by itself guarantee an accessible experience or legal compliance, and manual and assistive technology testing remain necessary. This entry describes the criterion as published and is not legal advice; readers with specific compliance questions should consult qualified counsel and current guidance.

Who it's relevant to

Keyboard users

People who navigate primarily or entirely with a keyboard, including some users with motor disabilities and users of certain assistive technologies, depend on a clear focus indicator to know which element is currently selected. A distinct, well-sized indicator helps them maintain orientation as they move through a page.

Users with low vision or cognitive disabilities

A larger, higher-contrast focus indicator can be easier to locate and follow, benefiting people who may struggle to perceive a faint or small outline. Focus guidance also helps identify what is clickable, supporting orientation for users who benefit from clearer visual cues.

Designers and front-end developers

Those building interactive interfaces are responsible for how focus indicators appear. Because SC 2.4.13 addresses the size and contrast of the indicator and is a Level AAA criterion, teams should decide deliberately whether to target it, style focus states accordingly, and avoid conflating it with SC 2.4.7 or SC 2.4.11.

Accessibility testers and QA teams

Verifying Focus Appearance requires manual keyboard testing and human judgment about whether an indicator is clearly discernible, since automated tools detect only a portion of issues. Testers should also distinguish this criterion from related WCAG 2.2 criteria to report findings accurately.

Compliance officers and accessibility program owners

Those setting conformance targets should understand that 2.4.13 is Level AAA and generally more stringent than the AA level most commonly cited as a goal. Adopting it can improve usability, but meeting any single criterion does not guarantee an accessible experience or legal compliance; consult qualified counsel for jurisdiction-specific questions.

Inside Focus Appearance

Success Criterion 2.4.13 Focus Appearance (Level AAA, WCAG 2.2)

Focus Appearance is a success criterion added in WCAG 2.2 and published at Level AAA in the WCAG 2.2 Recommendation. It sets out minimum requirements for how visible the keyboard focus indicator must be when a user interface component receives focus.

Minimum area of the focus indicator

The criterion addresses the size of the area that must be visibly changed to indicate focus, generally described in terms of an area at least as large as a defined perimeter around the focused component. Practitioners should consult the current W3C Understanding document for the exact geometric thresholds rather than relying on approximations.

Contrast of the focus indicator

The criterion concerns the contrast between the focus indicator's pixels in the focused and unfocused states, so that the indicator is distinguishable against adjacent colors. The precise contrast ratio is specified in the W3C text and should be verified there.

Not entirely hidden by other content

The focused component's indicator should not be entirely obscured by author-created content. Note that whether focus is obscured is also addressed by separate, distinct criteria in WCAG 2.2: 2.4.11 Focus Not Obscured (Minimum) at Level AA and 2.4.12 Focus Not Obscured (Enhanced) at Level AAA, which are different from 2.4.13 and should not be conflated with it.

Relationship to 2.4.7 Focus Visible

Focus Appearance builds on 2.4.7 Focus Visible, which is a Level AA criterion present in WCAG 2.0, 2.1, and 2.2 and requires that a keyboard focus indicator be visible. Focus Appearance (2.4.13, AAA) adds more specific quantitative requirements about the indicator's size and contrast.

Common questions

Answers to the questions practitioners most commonly ask about Focus Appearance.

Is Focus Appearance a Level AA success criterion numbered 2.4.11?

No. In the final WCAG 2.2 Recommendation, Focus Appearance is Success Criterion 2.4.13 at Level AAA. The number 2.4.11 belongs to a different, separate criterion, Focus Not Obscured (Minimum), which is Level AA. Confusing these is a common error. Because Focus Appearance is a AAA criterion, it is not part of the Level AA conformance target that is most commonly cited as a benchmark, though organizations may choose to meet it for stronger accessibility. This entry is general information, not legal advice.

Doesn't WCAG already require a visible focus indicator through Focus Visible at Level A, making Focus Appearance redundant?

Not quite. Focus Visible is Success Criterion 2.4.7, and it is a Level AA criterion in WCAG 2.0, 2.1, and 2.2, not Level A. Focus Visible requires that a mode of operation showing a visible keyboard focus indicator be available, but it does not specify how large, contrasting, or prominent that indicator must be. Focus Appearance (2.4.13, Level AAA) adds more specific quantitative expectations about the indicator's size and contrast. The two criteria address related but distinct concerns, and meeting one does not automatically satisfy the other.

What does Focus Appearance ask designers to provide for keyboard focus indicators?

Focus Appearance (SC 2.4.13, Level AAA) sets out more specific expectations for how prominent a keyboard focus indicator should be than the more general Focus Visible criterion. It addresses factors such as the area the indicator covers and the contrast between its focused and unfocused states. Teams targeting this criterion should consult the W3C's current Understanding document for the precise wording and worked examples, since the exact thresholds are detailed and best applied directly from the source.

If we are aiming for WCAG 2.2 Level AA conformance, do we need to meet Focus Appearance?

For a Level AA conformance target, you would not be required to meet Focus Appearance, because it is a Level AAA criterion. At Level AA you would still need to satisfy Focus Visible (2.4.7) and, in WCAG 2.2, Focus Not Obscured (Minimum) (2.4.11). Many teams choose to design toward the stronger focus indicators described in Focus Appearance anyway, since prominent focus indicators generally benefit keyboard users. Whether a specific legal or contractual obligation applies depends on the governing authority and any referenced standard, which is a question for qualified counsel.

How does Focus Appearance relate to the other focus-related criteria in WCAG 2.2?

WCAG 2.2 includes several distinct focus-related criteria that are easy to confuse. Focus Visible (2.4.7, Level AA) requires an available visible focus indicator. Focus Not Obscured (Minimum) (2.4.11, Level AA) and Focus Not Obscured (Enhanced) (2.4.12, Level AAA) address whether the focused element is hidden by other content. Focus Appearance (2.4.13, Level AAA) addresses how prominent the indicator itself is. Because they carry different numbers and levels, teams should treat each separately rather than assuming one covers the others.

Can automated testing confirm that we have met Focus Appearance?

Automated tools can detect only a portion of accessibility issues and are generally limited in evaluating the visual prominence of focus indicators across interactive states. Confirming that focus indicators are sufficiently visible typically requires manual review, including keyboard navigation testing and visual inspection of focused and unfocused states. Testing with assistive technologies and real users provides further confidence. Meeting a success criterion, whether verified automatically or manually, does not by itself guarantee an accessible experience for every user or immunity from legal claims.

Common misconceptions

Focus Appearance is a Level AA requirement numbered 2.4.11.

In the WCAG 2.2 Recommendation, Focus Appearance is Success Criterion 2.4.13 at Level AAA. The number 2.4.11 refers to a different criterion, Focus Not Obscured (Minimum), which is Level AA. Conflating these is a common source of error.

2.4.7 Focus Visible is a Level A requirement.

Focus Visible (2.4.7) is a Level AA criterion in WCAG 2.0, 2.1, and 2.2. It is often confused with lower-level criteria, but it has consistently been published at Level AA.

Meeting Focus Appearance guarantees that keyboard users can perceive focus in all situations and that a site is legally compliant.

Conformance with a success criterion supports usability but does not by itself guarantee an accessible experience for every user, nor immunity from legal claims. Manual and assistive-technology testing are generally needed, and because 2.4.13 is Level AAA, many organizations target Level AA rather than AAA. This is not legal advice.

Best practices

Reference the current W3C Understanding document for SC 2.4.13 to confirm the exact size and contrast thresholds rather than relying on remembered figures, and cite it as Level AAA when documenting conformance targets.

Distinguish 2.4.13 Focus Appearance from the separate 2.4.11 Focus Not Obscured (Minimum, AA) and 2.4.12 Focus Not Obscured (Enhanced, AAA) criteria when writing requirements or audit reports to avoid confusion.

Ensure a visible keyboard focus indicator is present for all interactive components to meet the underlying Level AA criterion 2.4.7 Focus Visible, then treat 2.4.13 as an enhanced (AAA) target where feasible.

Test focus indicators manually with keyboard navigation and assistive technology, since automated tools detect only a portion of focus-related issues.

Verify focus-indicator contrast against adjacent colors in both focused and unfocused states, and check that indicators are not entirely obscured by overlays, sticky headers, or other author content.

Clarify with stakeholders which conformance level (commonly AA) is being targeted, and consult qualified legal counsel and current agency rulemaking regarding any legal obligations, as requirements evolve through regulation and case law.