Command Palettes & Keybindings

Command palette components

• ★ cmdk — Radix-flavored, used by shadcn/ui's Command and Vercel's ⌘K UI. The default in 2026.
• kbar — older alternative; theming + actions.
• @xeger/spotlight — minimalist palette.
• headless cmdk equivalents in Vue/Svelte: vue-cmdk, svelte-command.

Keybinding libraries

• ★ tinykeys — < 600 bytes, modern, supports chord shortcuts ($mod+k k).
• react-hotkeys-hook — React hook API; ergonomic.
• hotkeys-js — vanilla; older.
• mousetrap — older still; widely used.
• @blocknote/shortcuts — bundled with BlockNote if you're using their editor.

Patterns to adopt

• ⌘K to open command — universal in 2026; users expect it.
• ? to show keyboard shortcut help — standard in GitHub, Linear, Notion.
• Cross-platform $mod keys — tinykeys and friends abstract Cmd vs Ctrl.
• Chords like g i ("go inbox") — Linear / Gmail style.
• Avoid trapping browser shortcuts like ⌘N, ⌘W, ⌘L.

Building a real palette

• Use cmdk for the UI primitive.
• Use TanStack Query or your data layer for async results (search, recent items).
• Use Fuse.js or MiniSearch for client-side fuzzy matching.
• Use use-debounce or Pacer for input throttling.
• Index your routes / actions / docs as palette items.

Pick this if…

• Default ⌘K palette: cmdk + Fuse.js for matching.
• Want it ready-styled: shadcn/ui's Command component.
• Just need keybindings, not a palette: tinykeys (modern) or react-hotkeys-hook (React).