ComponentsKbd

displaytexulinot agent-emittableapp

Kbd

kbd

Inline keyboard key affordance.

Live examples

Save shortcut

Save shortcut

Loading demo…

Labelled key

Labelled key

Props

Public props for Kbd
NameKindRequiredDefaultDescription
labelstringno—Plain-text key name, escaped; replaces children when both are given
classstringno——
childrenslotno—The key name (an inline-text node in a tree)

Keyboard

Keyboard behavior for Kbd
KeyAction
aRendered as a real kbd element; text is escaped.

Accessibility

  • Rendered as a real kbd element; text is escaped.

Evidence for kbd

Latest committed gates for kbd (as of 2026-10-23). Static snapshot — not live CI.

Behavior

n/ano behavior scenario

No dedicated behavior scenario for this catalog id (a styled or display surface, covered by its unit and axe tests).

Size (gzip)

texuli/kbd · budget 12.0 KiB

Budget from texuli.budgets.json; re-measure with `pnpm size --filter <entry>`.

Axe

documented

  • tests/e2e/site-component-pages.spec.ts
  • docs/quality (a11y-*)

Site component pages axe gate; package-level a11y docs under docs/quality when present.

Browsers

  • chromium
  • webkit
  • mobile

Playwright projects: Desktop Chrome, Desktop Safari, Pixel 7. Firefox is a known gap on this host.

When to use

Use when

  • Document a shortcut next to a control

Don’t use when

Prefer another component

  • Multi-line code (use code with variant block)