Accessibility

The bar

Texuli components target WCAG 2.1 A/AA. Contrast is measured with WCAG 2.x algorithms — APCA is intentionally out of scope. Forced-colors maps use system keywords (CanvasText, ButtonText, Highlight), not decorative yellows that fail on Canvas.

Labels and names

Prefer a visible label. When the control already has accessible text, do not add a conflicting aria-label. Field wires id, aria-describedby and aria-invalid for you.

import { Field } from 'texuli/field';
import { Input } from 'texuli/input';

<Field label="Workspace name" description="Shown on invoices." required>
  {#snippet children(control)}
    <Input {...control.props} bind:value={name} />
  {/snippet}
</Field>

Keyboard

Every interactive control is reachable by Tab, activates with Enter or Space where expected, and exposes a visible focus ring from --tx-ring. Composite widgets (menus, grids, tabs) use roving tabindex from @texuli/core/roving.

Live controls