Shadcn.io is not affiliated with official shadcn/ui
Kbd
Keyboard shortcut badges for displaying hotkeys and key combinations in React
Those little keyboard key badges you see in app menus and documentation? This is that. ⌘+K looks like actual keyboard keys, not just text. Multiple keys automatically get the + separator between them, and the monospace font keeps everything aligned. It's a small detail, but it makes your keyboard shortcuts look professional instead of amateur. Perfect for command palettes, settings pages, tooltips that show hotkeys, or anywhere you're teaching users your keyboard shortcuts.
Scroll to load preview
Installation
Related Components
FAQ
Was this page helpful?
Sign in to leave feedback.