Checkbox

A basic element that can be marked as selected and can be used in a list to provide multiple selection options.

Accessibility

 

Keyboard


Key

Interaction

Space or Enter

Toggles the checkbox between selected and not selected. if the checkbox is partially selected initially, the checkbox becomes selected first (subsequent toggles alternate normally between selected and not selected).

Tab

Moves to the next option item in the group

 

Design Checklist


Ref to 23:4917

 

Accessible use of color

Color is not used as the only visual means of conveying information and meet a minimum of Level AA WCAG standards.

Ref to 23:4917

Accessible contrast for text

Text has a contrast ratio of at least 4.5:1 for small text and at least 3:1 for large text.

Ref to 23:4917

Accessible contrast for UI components

Visual information required to identify components and states (except inactive components) has a contrast ratio of at least 3:1.

Ref to 23:4917

Keyboard interactions

Follows WCAG 2.2 standards for keyboard accessibility guidelines and includes a description of the keyboard interactions.