Stalk UI

Component

Kbd

Marks a keyboard key or shortcut.

Install

Run the CLI to copy the source into your project.

pnpm dlx @stalk-ui/cli add @stalk-ui/kbd

Examples

Live previews render through the docs app's PandaCSS codegen.

Theme
<Kbd>Esc</Kbd>
Theme
<Text>
  Press <Kbd>⌘</Kbd> <Kbd>K</Kbd> to open search.
</Text>
Theme
<Kbd size="lg">Enter</Kbd>

Props

Public component props extracted from the source TypeScript types.

PropTypeRequiredDefaultDescription
`size``KbdSize`No--

Variants

Variant axes exposed by the underlying PandaCSS recipe or slot recipe.

VariantValues
`size``sm`, `md`, `lg`

Registry

Files this component contributes to your registry install.

  • Manifest: `/r/kbd.json`
  • Recipe: `kbd`
  • Files: `src/components/ui/kbd.tsx`