Your Search Results

    Using the checkbox role


    This technique demonstrates how to use the checkbox role. 

    The checkbox role is used for checkable interactive controls. If an element uses role="checkbox" it is required for that element to also have a aria-checked attribute that exposes the checkbox's state to assistive technology. While the native HTML checkbox  form control can only have two checked states ("checked" or "not checked"), a role=checkbox element can expose three states through aria-checked:

    • aria-checked="true": The checkbox is checked
    • aria-checked="false": The checkbox is not checked
    • aria-checked="mixed": The checkbox is partially checked

    The developer is required to dynamically change the value of the aria-checked attribute when the checkbox is activated. 

    Since a checkbox is an interactive control it must be focusable and keyboard accessible. If the role is applied to a non-focusable element, the tabindex attribute will have to be used to change this. The expected keyboard shortcut for activating a checkbox is the Space key.

    Possible effects on user agents and assistive technology 

    When the checkbox role is added to an element, the user agent should do the following:

    • Expose the element as having an checkbox role in the operating system's accessibility API.
    • When the aria-checked value changes, send an accessible state changed event.

    Assistive technology products should do the following:

    • Screen readers should announce the element as a checkbox, and optionally provide instructions on how to activate it.
    Note: Opinions may differ on how assistive technology should handle this technique. The information provided above is one of those opinions and therefore not normative.


    Example 1: Adding the checkbox role in ARIA

    <span role="checkbox" aria-checked="false" tabindex="0" id="chk1"></span>
    <label for="chk1">Remember my preferences</label>

    Working Examples:


    ARIA attributes used


    TBD: Add support information for common UA and AT product combinations

    Additional resources

    Document Tags and Contributors

    Contributors to this page: pendlepants, Fredchat, hhillen, allen, Sheppy
    Last updated by: allen,