Skip to content

Consumer contract

Accessibility

CSS can preserve focus, contrast, motion preferences, and readable layout. Correct semantics, names, state, keyboard behavior, and announcements still come from HTML and application code.

Required author responsibilities

  1. Start with native HTML. Use buttons, links, inputs, details, dialog, progress, and tables for their intended purpose.
  2. Name every control. Visible labels are preferred; icon-only buttons require an accessible name.
  3. Expose state. Keep aria-expanded, aria-selected, aria-invalid, aria-busy, and aria-current synchronized with behavior.
  4. Own keyboard behavior. Custom menu, tab, drawer, and dialog scripts must implement their complete interaction model.

Feedback semantics

Ordinary update

Use a polite live region or role="status" without moving focus.

Urgent failure

Reserve role="alert" for information requiring immediate attention.

Automated coverage

The repository validates both themes with html-validate and runs axe, keyboard, mobile overflow, zoom, normal-motion, and reduced-motion contracts in Chromium, Firefox, and WebKit. Chromium additionally captures OS-specific visual regressions. Automation cannot prove screen-reader usability or replace keyboard and zoom review on the final application.