Keyboard shortcuts for quality of life while working in the builder. Here’s what I got used to in Webflow to help you speed up my design workflow.
- Show shortcut cheatsheet: Shift + /
- Save as Snapshot: Shift + Command + S (Mac) or Shift + Control + S (Windows)
- Deselect Element/Exit: Esc
- Delete Element: Delete
- Show Publish Dialog: Shift + P
- Show Symbols panel: Shift + A
- Make selected element a Symbol: Command + Shift + A (Mac) or Control + Shift + A (Windows)
- Show Asset Manager: J
Right-hand tabs shortcuts:
- Show Style tab: S
- Show Settings tab: D
- Show Style Manager tab: G
- Show Interactions tab: H
Copy/paste shortcuts:
- Copy: Command + C (Mac) or Control + C (Windows)
- Cut: Command + X (Mac) or Control + X (Windows)
- Paste: Command + V (Mac) or Control + V (Windows)
- Duplicate: Command + D (Mac) or Control + D (Windows)
Preview mode and other view shortcuts:
- Preview mode: Shift + Command + P (Mac) or Shift + Control + P (Windows)
- Guide overlay: Shift + Command + G (Mac) or Shift + Control + G (Windows)
- Show element edges: Shift + Command + E (Mac) or Shift + Control + E (Windows)
- X-ray mode: Shift + Command + X (Mac) or Shift + Control + X (Windows)
To see the full list of keyboard shortcuts in the Webflow Designer, press Shift + / or access the list from the help menu on the bottom left of the Designer.