Keyboard Shortcut Hint

Raised kbd keys joined with a plus separator. Any combo works.

Quick search
K

Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.

Import & use
import { Keyboard1 } from "@/components/beste/piece/keyboard1";

<Keyboard1
  keys={[
    "⌘",
    "K"
  ]}
  label="Quick search"
/>

More Keyboard pieces

View all Keyboard
Keyboard shortcuts
Open search
K
New file
N
Toggle sidebar
B
Switch workspace
O

Titled panel listing several actions with their key combos stacked on the right.

G
Leader
P
Go to project
Press in sequence

Vim-style multi-step combo showing keys separated by arrows with per-step labels.

Space
Press to continue

Lit-up key with a pinging halo behind it and a caption beneath to cue the user.

BA
Unlock the secret

Key Sequence

keyboard13

Row of small tactile keycaps laid out in order, great for Konami-style cheat codes or macro combos.

F1Help
F2Rename
F3Find next
F4Close
F5Reload

Function Row

keyboard10

Horizontal strip of F-keys, each annotated with the action it triggers.

PressKto open search

Rounded pill that embeds a keycap between prefix and suffix copy for quick prompts.