Data display
Kbd
Renders a keyboard key in running text.
Press ⌘ K to search the board
Usage
import { Kbd, KbdGroup } from "@kanzo-tech/ui";<Kbd>⌘</Kbd> <Kbd>K</Kbd>Kbd is pointer-events-none: it is a label, never a target, so it cannot swallow a click
meant for the button it sits inside.
Variants
EscEsc
Group
KbdGroup is the spacing wrapper for a chord — it keeps the keys of one shortcut together
when several shortcuts share a line.
Search the board
⌘K
Post a contract⌘N
API Reference
| Prop | Type | Default |
|---|---|---|
variant | "default" | "outline" | "default" |
Extends React.ComponentProps<typeof ark.kbd>. Inside a TooltipContent the recipe inverts
its own colours, so a shortcut hint in a tooltip needs no override.