# Token Names

Every token to use in app CSS, on one page: the semantic theme tokens, then
the scale. Names only; [theme](theme) and [scale](scale) give the values.

Left out: the raw ramp steps (`--neutral-500`, `--danger-600`, ...). Use the
semantic token that points at one, so the color follows the theme and dark
mode.

<!-- GENERATED by tools/styledocs. Do not hand-edit. -->

## white

`--white`

## black

`--black`

## bg

`--bg`, `--bg-soft`, `--bg-muted`, `--bg-panel`, `--bg-elevated`, `--bg-canvas`,
`--bg-inverse`

## ink

`--ink`, `--ink-soft`, `--ink-dim`, `--ink-faint`, `--ink-inverse`,
`--ink-soft-flow`

## rule

`--rule`, `--rule-soft`, `--rule-strong`

## accent

`--accent`, `--accent-deep`, `--accent-soft`, `--accent-ink`, `--accent-edge`

## success

`--success`, `--success-fill`, `--success-soft`, `--success-ink`,
`--success-edge`

## warning

`--warning`, `--warning-soft`, `--warning-ink`, `--warning-edge`

## danger

`--danger`, `--danger-fill`, `--danger-soft`, `--danger-ink`, `--danger-edge`

## info

`--info`, `--info-fill`, `--info-soft`, `--info-ink`, `--info-edge`

## focus

`--focus`, `--focus-ring`, `--focus-ring-danger`

## opacity

`--opacity-disabled`, `--opacity-muted`, `--opacity-overlay`

## transition

`--transition-colors`, `--transition-shadow`, `--transition-transform`,
`--transition-opacity`

## radius

`--radius`, `--radius-control`, `--radius-surface`, `--radius-overlay`,
`--radius-dialog`, `--radius-tag`, `--radius-pill`

## checkbox

`--checkbox-check`

## select

`--select-caret`

## input

`--input-height`, `--input-height-sm`, `--input-height-lg`, `--input-padding-x`,
`--input-padding-y`, `--input-radius`, `--input-font-size`, `--input-bg`,
`--input-border`, `--input-border-hover`, `--input-border-focus`,
`--input-placeholder`

## button

`--button-height`, `--button-height-sm`, `--button-height-lg`,
`--button-height-hero`, `--button-padding-x`, `--button-padding-x-sm`,
`--button-padding-x-lg`, `--button-radius`, `--button-font-size`,
`--button-font-size-lg`, `--button-font-weight`

## avatar

`--avatar-size`, `--avatar-size-xs`, `--avatar-size-sm`, `--avatar-size-lg`,
`--avatar-size-xl`, `--avatar-radius`

## terminal

`--terminal-bg`, `--terminal-ink`, `--terminal-dim`

## text

`--text-2xs`, `--text-xs`, `--text-sm`, `--text-base`, `--text-md`, `--text-lg`,
`--text-xl`, `--text-2xl`, `--text-3xl`, `--text-4xl`, `--text-5xl`,
`--text-6xl`, `--text-7xl`, `--text-8xl`

## weight

`--weight-thin`, `--weight-light`, `--weight-regular`, `--weight-medium`,
`--weight-semibold`, `--weight-bold`, `--weight-black`

## leading

`--leading-none`, `--leading-tight`, `--leading-snug`, `--leading-body`,
`--leading-relaxed`, `--leading-loose`

## tracking

`--tracking-tighter`, `--tracking-tight`, `--tracking-snug`,
`--tracking-normal`, `--tracking-wide`, `--tracking-wider`, `--tracking-widest`

## font

`--font-sans`, `--font-serif`, `--font-mono`

## space

`--space-0`, `--space-px`, `--space-0-5`, `--space-1`, `--space-1-5`,
`--space-2`, `--space-2-5`, `--space-3`, `--space-3-5`, `--space-4`,
`--space-5`, `--space-6`, `--space-7`, `--space-8`, `--space-9`, `--space-10`,
`--space-11`, `--space-12`, `--space-14`, `--space-16`, `--space-20`,
`--space-24`, `--space-28`, `--space-32`, `--space-40`, `--space-48`,
`--space-56`, `--space-64`

## radius

`--radius-none`, `--radius-xs`, `--radius-sm`, `--radius-md`, `--radius-lg`,
`--radius-xl`, `--radius-2xl`, `--radius-3xl`, `--radius-4xl`, `--radius-full`

## shadow

`--shadow-xs`, `--shadow-sm`, `--shadow-md`, `--shadow-lg`, `--shadow-xl`,
`--shadow-2xl`, `--shadow-inner`

## duration

`--duration-instant`, `--duration-fast`, `--duration-normal`, `--duration-slow`,
`--duration-slower`

## ease

`--ease-linear`, `--ease-out`, `--ease-in`, `--ease-in-out`, `--ease-spring`

## z

`--z-base`, `--z-raised`, `--z-sticky`, `--z-fixed`, `--z-overlay`, `--z-modal`,
`--z-popover`, `--z-dropdown`, `--z-tooltip`, `--z-toast`, `--z-top`

## bp

`--bp-sm`, `--bp-md`, `--bp-lg`, `--bp-xl`, `--bp-2xl`

## container

`--container-xs`, `--container-sm`, `--container-md`, `--container-lg`,
`--container-xl`, `--container-2xl`, `--container-3xl`, `--container-4xl`,
`--container-5xl`, `--container-6xl`, `--container-7xl`, `--container-prose`,
`--container-shell`, `--container-wide`, `--container-padding`

## measure

`--measure`