Component Library
A distributable vanilla CSS and JavaScript bundle is available in the Component Library guide.
Select a component from the list below to view full documentation, keyboard support, ARIA requirements, and code examples.
Accordion
Vertically stacked sections of content, each revealed by activating a header trigger.
Alert
Inline status messages that communicate important information without interrupting workflow.
Alert Dialog
Modal dialogs that contain urgent messages requiring immediate user acknowledgment.
Breadcrumb
Hierarchical navigation trail showing current page location within the site structure.
Button
Interactive controls that trigger actions, with full keyboard and screen reader support.
Card
Flexible content containers used for grouping related information and actions.
Checkbox
Input controls for binary selections, with indeterminate state support for groups.
Combobox
Combined text input with filterable dropdown list, with full ARIA listbox integration.
Dialog
Modal windows that contain content or forms requiring user interaction before returning to main content.
Disclosure
Simple show/hide toggle for secondary content, using a button to control visibility.
Form Validation
Accessible inline error messages with live region announcements and aria-describedby associations.
Menu Button
Dropdown menus triggered by a button, following the ARIA menu button pattern.
Modal
Full-featured modal implementation with focus trapping, backdrop, and scroll lock.
Pagination
Navigation controls for paged content with current page indication and ARIA landmarks.
Radio Group
Groups of mutually exclusive radio inputs with roving tabindex keyboard navigation.
Select
Native and custom select controls for choosing from a list of options.
Skip Link
Keyboard shortcut allowing users to bypass repeated navigation and jump to main content.
Slider
Range input for selecting a value within a defined min/max range using arrow keys.
Switch
Toggle controls representing on/off states using the ARIA switch role.
Table
Accessible data tables with proper header associations, captions, and sortable columns.
Tabs
Tabbed interface for organizing content into selectable panels with ARIA tablist pattern.
Toast Notification
Transient status notifications using ARIA live regions for screen reader announcements.
Tooltip
Supplemental descriptions revealed on hover and focus, following the ARIA tooltip pattern.
Tree View
Hierarchical list with expand/collapse functionality using ARIA treeitem roles.
Design Principles
No ARIA Is Better Than Bad ARIA
This design system uses the minimum ARIA necessary. Where native HTML semantics provide equivalent accessibility, we use them without augmentation.
Keyboard First
Every component in this library is fully operable by keyboard. Keyboard interactions follow the patterns defined in the WAI-ARIA Authoring Practices Guide.
Progressive Enhancement
Components function with native HTML controls where possible, with JavaScript enhancing the experience for users who benefit from dynamic behavior.
Tested with Assistive Technology
All components are tested with NVDA, JAWS, VoiceOver, and Narrator before inclusion in this library.