kit

Components

Inputs

Form controls with visible labels, hints and errors wired up for screen readers. All of them submit with a normal form.

A labelled native input or textarea with a hint, an error, and prefix and suffix groups, built on the browser's own validation and autofill.

Error message saying how to fix it.

Hint text below the control.

.example.com
Tier 1 · CSS only Native input preview

A native select, styled to sit beside text fields, that opens the platform's own picker so it works everywhere.

Hint text below the control.

Tier 1 · CSS only Native select preview

A native checkbox, restyled, with its label, an optional hint and a mixed state for select-all rows.

Tier 1 · CSS only Native checkbox preview

An on and off switch for settings that take effect at once, a native checkbox underneath so it submits and resets like one.


Tier 1 · CSS only Native checkbox (role switch) preview

Native radios in a fieldset for one choice from a few, as a list, a row or a set of tiles.

Group label
Row layout
Tiles
Tier 1 · CSS only Native radio preview

A native range input with a filled track and a live value readout, for picking a number where the rough position matters more than the exact figure.

Hint text below the control.

Tier 2 · behaviour Native range beta

Planned for this page

  • Combobox
  • Number stepper
  • Tag input
  • File drop
  • Date picker
  • Colour picker