Skip to the page
Tactile UI

Kit parts

Bar

The top of a page: a wordmark with a lamp, printed links, and one contrast key at most.

On this page
  1. Anatomy
  2. Variants
  3. States
  4. Usage notes
  5. Accessibility
  6. Related parts

Seats open in 11 days. Want one email that morning?

Anatomy

A flex row and type, nothing else. The lamp is the kit’s lamp; the key is the kit’s key.

Variants

  • Brand and links

States

  • Link
  • Hover
  • Current
  • Focus

Usage notes

The current page is printed in full ink; the rest in the second ink.

Accessibility

  • On phones, let it wrap or move links into a menu; do not let it scroll the page sideways.

Side rail

App navigation in a panel: the current page is a recess with its lamp lit, links grouped under printed labels.

Tabs

Views of the same thing, switched in place: keys in a tray, the chosen view a raised cap.

Key

Every button, and every link that acts like one: a cap on a skirt that drops below the plate when pressed.