Does the Webflow Designer have any keyboard shortcuts?

Yes, there are many keyboard shortcuts that can help make your workflow as quick and efficient as possible. The quickest way to see all shortcuts is pressing Shift+/ in the Designer.

Below are some of the available keyboard shortcuts that work in the Webflow Designer. If you have any ideas for a cool keyboard shortcut let us know and we’ll try to add it :)

General

Save As Snapshot: Shift +⌘+S (Mac) or Shift + ctrl +S (Windows)

Unselect/Abort: Esc

Delete Element: Delete

Show Publish Dialog: Shift + P

Show Export Code Dialog: Shift + E

View

Preview Mode: Shift + ⌘ + P (Mac) or Shift + ctrl + P (Windows)

Grid Overlay: Shift + ⌘ + G (Mac) or ⇧+ctrl+G

Element Edges: Shift +⌘+E or ⇧+ctrl+E

X-Ray Mode: ⇧+⌘+X or ⇧+⌘+X

Left Tool Bar

Show Add Panel: A

Show Pages Panel: P

Right Tabs Panel

Show Style Tab: S

Show Settings Tab: D

Show Navigator Tab: F

Show Style Manager Tab: G

Show Global Objects Tab: H

Show Asset Manager: J

Copy/Paste

Copy: ⌘+C or ctrl+C

Cut: ⌘+X or ctrl+X

Paste: ⌘+V or ctrl+V

Duplicate: Hold Alt+Drag

Undo/Redo

Undo: ⌘+Z or ctrl+Z

Redo: ⇧+⌘+Z or ⇧+ctrl+Z

Media Queries

Desktop: 1

Tablet: 2

Phone (Landscape): 3

Phone (Portrait): 4

Other

Margin/Padding (All Sides): Hold Shift+Drag

Margin/Padding (Pairs): Hold Alt+Drag

Select Parent/Child Element: ↑ ↓

Select Sibling Element: ← →

Select Next/Previous Element: Alt+↑ ↓

Show Keyboard Shortcuts: ?