Kbd

⌘⇧P

Press Ctrl+K to search

Installation

pnpm dlx shadcn@latest add @paneui/kbd

import { Kbd, KbdGroup } from "@/components/ui/kbd"

<KbdGroup>
  <Kbd>⌘</Kbd>
  <Kbd>K</Kbd>
</KbdGroup>

TooltipKbd is a small Kbd on the tooltip's own fill, so shortcuts read the same in tooltips, menus and buttons.

Also accepts every prop of kbd.

Prop	Type	Default	Description
size	"sm" \| "default" \| "lg"	"default"	Key height (16 / 20 / 24px).

Keys pressed together or in sequence. Also accepts every prop of kbd.