Kbd
A keyboard key rendered literally in the seam language: a tiny embossed keycap resting on the surface.
⌘K
Press ⇧ Enter for a new line
tsx
import { Kbd, KbdGroup } from "@/registry/seam/ui/kbd"
export default function KbdDemo() {
return (
<div className="flex flex-col items-center gap-3 text-sm">
<KbdGroup>
<Kbd>⌘</Kbd>
<Kbd>K</Kbd>
</KbdGroup>
<p className="text-muted-foreground">
Press <Kbd>⇧</Kbd> <Kbd>Enter</Kbd> for a new line
</p>
</div>
)
}bunx --bun @seamui/cli@latest add kbdNotes
- Static by design — a Kbd depicts a key, it isn't one; no press feedback, not focusable or clickable.
- Renders a native
<kbd>element, announced as keyboard input; prefer full key names (“Shift”) or anaria-labelwhen a symbol alone (⇧) could be ambiguous.
Press feedback, reduced motion, and haptics follow the global policy — see Motion and Haptics.