humanonlyweb/ui

Kbd

A keyboard shortcut, shown with the user's platform keys.

Markdown

Examples

Chords

mod is ⌘ on Apple, Ctrl elsewhere.

  • Command palette Control K
  • Save as Control Shift S
  • New line Shift Enter
  • Forced PC keys Control Alt P
Copy code

API

PropTypeDefault
keys

Chord written as "mod+k" or "shift enter". mod is ⌘ on Apple, Ctrl elsewhere.

string—
size

Size hook, exposed as data-kbd-size.

"medium" | "small""medium"
platform

Forces a platform's key caps instead of the detected one.

"apple" | "pc"—
SlotProps
default

A single literal key, when keys isn't set.

—

Styling

Parts
kbdkeykbd-label
States
data-kbd-size

Accessibility

  • Screen readers hear key names, e.g. “Command K”.