Standard

A component that allows a user to query for results.

Keyboard


Key

Interaction

Enter (when applicable)

Activates search query.

Additional keyboard guidance

The clear button is intentionally excluded from keyboard tab order and follows native <input type="search"> behavior. Keyboard users can clear the field using standard text editing interactions such as Backspace, Delete, or select-all + delete. This approach reduces unnecessary tab stops while maintaining full keyboard accessibility.

Design Checklist


Ref to 23:4917

 

Accessible use of color

Color is not used as the only visual means of conveying information and meets 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 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

It follows WCAG standards for keyboard accessibility guidelines and includes a description of keyboard interactions.