shadcn.io is an independent project built on shadcn/ui
The first cap is the ⌘ character and the second is K, in one group. That is the menu spelling, not a live chord. Nothing is listening.
Use the symbol for Mac readers. Write Ctrl for Windows and Linux, or detect the platform. A Button can carry the hint. In React, Base UI does not map ⌘ to a key code.
Installation
Anatomy
Usage
<div className="rounded-md border bg-background p-4">
<KbdGroup>
<Kbd>⌘</Kbd>
<Kbd>K</Kbd>
</KbdGroup>
</div>FAQ
When should I show ⌘ instead of Ctrl?
For Mac users. Detect the platform and switch, as the Platform-Aware Shortcut example does, or show both, like ⌘K / Ctrl K, when you can't know.
What is the ⌘ symbol and how do I type it?
It's the place of interest sign, U+2318. Paste it from macOS's Character Viewer (Ctrl ⌘ Space) or copy it from here; in code it's just a character in the string.
Which ⌘ shortcuts are worth documenting?
The ones specific to your app, plus any standard ones you change. People already know ⌘C, ⌘V, ⌘Z and ⌘S; ⌘K for search or ⌘Enter to send are worth a hint.
Why do Macs use Command instead of Ctrl?
The first Macintosh gave app shortcuts their own key, so Control could keep its terminal meaning. That's why Mac shortcuts use ⌘ where Windows uses Ctrl.
API Reference
Kbd
No extra props in this demo. The rest is on the Kbd page.
