Keyboard shortcuts
Every shortcut in Stacki, grouped by what it acts on.
Shortcuts are written for macOS. On Windows, ⌘ is Ctrl, ⌥ is Alt and ⇧ is Shift — the tables below say so themselves when you read them on a Windows machine.
Single-letter shortcuts are ignored while you are typing in a field, so a prop
value can still contain the letter s or the digit 2.
Panels
| Shortcut | Does |
|---|---|
| P | Pages |
| Z | Navigator |
| ⇧A | Components |
| J | Assets |
| ⌥C | CMS |
| S | Style tab |
| D | Settings tab |
Pressing the shortcut for the panel that is already open collapses it, which gives the canvas the whole window.
The rail’s tooltip offers ⌥V for Variables. In 0.1.8 that key is not wired up yet — use the rail button.
Editing
| Shortcut | Does |
|---|---|
| ⌘E or ⌘F | Open the insert palette |
| ⌘Enter | Jump to the class field, with the caret in it |
| Enter | Open the selection’s code editor (frontmatter, <style>, <script>) |
| ⌘C | Copy the selected node |
| ⌘V | Paste it |
| ⌘D | Duplicate it |
| Delete / Backspace | Remove it |
| ⌘Z | Undo |
| ⇧⌘Z or ⌘Y | Redo |
Copy and paste fall back to normal text behaviour when a field has focus or text is selected.
Undo and redo are global: CSS edits, CMS edits and asset changes are on the same stack as page edits, and they work from anywhere in the app — including inside a field, so field edits and structural edits undo in the order you made them.
Canvas
| Shortcut | Does |
|---|---|
| 1 | Desktop |
| 2 | Tablet — 768px |
| 3 | Phone — 375px |
| 4 | Canvas — every breakpoint at once |
| Esc | Exit preview mode, or step out of a component you drilled into |
Navigator
| Shortcut | Does |
|---|---|
| ← / → | Previous / next sibling |
| ↑ | Parent |
| ↓ | First child |
Fields
| Shortcut | Does |
|---|---|
| ↑ / ↓ in a number field | Step by 1 |
| ⇧ + step | Step by 10 |
| ⌥ + step | Step by 0.1 |
| ⌥-click a spacing value | Remove it |
| ⇧-drag a spacing side | Change all four sides |
| ⌥-drag a spacing side | Change that side and its opposite |
| Enter | Commit and blur |
| Esc | Cancel and put the old value back |
Application menu
| Shortcut | Menu item |
|---|---|
| ⌘E | Edit → Insert Element… |
| ⌘Z / ⇧⌘Z | Edit → Undo / Redo |
| ⌘C / ⌘V | Edit → Copy / Paste |
On macOS the native menu takes these keys before the page sees them, so they are routed back into the editor — which is why they act on the selected node when no field has focus, and on the text when one does.