shadcn.io is not affiliated with official shadcn/ui
Kbd examples · Sequence
Vim Command Sequence Kbd for React
The colon, W and Q keys in a row for Vim's save-and-quit command.
Vim commands are typed, one key after another: colon, W, Q, then Enter to save and quit. This React example shows :, W and Q as three Kbd caps in a tight row with no separators, since the keys are typed in order rather than pressed together.
Preview
Installation
FAQ
What is Vim's command mode?
Typing a colon in normal mode opens a command line at the bottom of the screen. You type a command, like wq, and press Enter to run it, or Esc to cancel.
Why so little space between the keys?
The keys are typed as one word, so gap-1 keeps them together. A wider gap, or an arrow, would suggest separate steps with a pause between them.
Are Vim commands case-sensitive?
Yes: the command is :wq in lowercase, and :WQ fails. The caps show capital letters because that's what keyboards print; say lowercase in the text, or show the command in code next to the keys.
Which Vim commands are worth documenting?
:w to save, :q to quit, :wq to save and quit, :q! to quit without saving, and / to search. Those get most people in and out of Vim.
Related
- Key Sequence with Arrow KbdA G then G key sequence with an arrow
- Vim Navigation Keys KbdThe H, J, K and L keys in one row, the
- Key Sequence with Then KbdA Ctrl K chord, the word then, and a B
- Multi-Step Sequence KbdTwo chords in a row, Ctrl K then Ctrl S
- Arrow Keys Cross Pattern KbdFour arrow keys in the inverted T of a
- Arrow Keys Horizontal KbdLeft and right arrow keys grouped side by