Webflow

Webflow

A visual cheat-sheet for the 41 keyboard shortcuts found in Webflow

Keyboard Shortcuts

General

Shortcut	Action
Shift /	Show shortcut cheatsheet
Ctrl Shift S	Save as a snapshot
Esc	Deselect or abort
Del	Delete element
Shift P	Show publish dialog
Shift E	Show export code dialog
Enter	Edit element

{.shortcuts}

View

Shortcut	Action
Ctrl Shift P	Preview mode
Ctrl Shift G	Guide overlay
Ctrl Shift E	Show element edges
Ctrl Shift X	X-ray mode

{.shortcuts}

Left-hand Toolbar

Shortcut	Action
A	Show add panel
Z	Show navigator tab
P	Show pages panel
Shift A	Show symbols panel
Ctrl Shift A	Make selected element a symbol
J	Show asset manager

{.shortcuts}

Right-hand Tabs

Shortcut	Action
S	Show style tab
D	Show settings tab
G	Show style manager tab
H	Show interactions tab

{.shortcuts}

Copy/Paste

Shortcut	Action
Ctrl C	Copy
Ctrl X	Cut
Ctrl V	Paste
Alt (drag)	Duplicate

{.shortcuts}

Undo/Redo

Shortcut	Action
Ctrl Z	Undo
Ctrl Shift Z	Redo

{.shortcuts}

Device View

Shortcut	Action
1	Desktop
2	Tablet
3	Phone (landscape)
4	Phone (portrait)

{.shortcuts}

Style Panel

Shortcut	Action
Shift (drag)	Margin or padding (on all sides)
Alt (drag)	Margin or padding (top and bottom, or left and right)
Ctrl Enter	Add class to selected element
Ctrl Shift Enter	Rename last class on selected element

{.shortcuts}

Find

Shortcut	Action
Ctrl K	Quick find

{.shortcuts}

Other

Shortcut	Action
Alt (click)	Expand or collapse panel sections
Up/Down	Select parent or child element
Left/Right	Select sibling element
Alt Left/Right	Select next or previous element
Ctrl Shift L	Toggle collaborators on selected element

{.shortcuts}

Also see

• Keyboard shortcuts for Webflow (university.webflow.com)