Webflow Shortcuts - Brix Templates

Webflow shortcuts

Speed up your build process with our comprehensive cheat sheet of Webflow shortcuts for Windows and macOS

macOs shortcuts

Windows shortcuts

macOS
macOS
Windows
Windows
General Shortcuts - Brix Templates

General

Show shortcut cheatsheet
⇧
?
Save as snapshot
⇧
⌘
Ctrl
?
Deselect/Abort
Esc
Delete element
Del
Show publish dialog
⇧
P
Publish
⇧
P
or
⇧
Enter
Show export code dialog
⇧
E
Edit Element
Enter
Open slash command menu inside rich text
/
View Shortcuts - Brix Templates

View

Comments mode
⇧
N
Guide overlay
⇧
G
Toggle rulers
⇧
R
Show element edges
⇧
⌘
Ctrl
E
X-ray mode
⇧
⌘
Ctrl
X
Show empty elements
⇧
⌘
Ctrl
M
Left Hand Toolbar Shortcuts - Brix Templates

Left-hand toolbar

Show add panel
A
Show style selectors panel
G
Show navigator panel
Z
Expand/collapse navigator elements
Alt
Z
Show pages panel
P
Show variables panel
V
Show logic panel
L
Show assets panel
J
Show audits panel
U
Expand/collapse audits panel sections
Alt
U
Expand/collapse nested page folders
Alt
⇧
Click
Right Hand Toolbar Shortcuts - Brix Templates

Right-hand toolbar

Show style tab
S
Toggle style panel focus mode
Alt
⇧
S
Expand/collapse style panel sections
Alt
S
Show settings tab
D
Show interactions tab
H
Components Shortcuts - Brix Templates

Components

Show components panel
⇧
A
Make selected element a component
⌘
Ctrl
⇧
A
Edit main instance of selected component
Click
Click
Copy/Paste Shortcuts - Brix Templates

Copy/Paste

Copy
⌘
Ctrl
C
Cut
⌘
Ctrl
X
Paste
⌘
Ctrl
V
Duplicate
⌘
Ctrl
D
Duplicate
⌘
Ctrl
Drag
Undo/Redo Shortcuts - Brix Templates

Undo/redo

Undo
⌘
Ctrl
Z
Redo
⌘
Ctrl
⇧
Z
Device View Shortcuts - Brix Templates

Device views

Desktop
1
Tablet
2
Mobile landscape
3
Mobile portrait
4
Move Elements Shortcuts - Brix Templates

Move elements

Move before previous element
[
or
⌘
Ctrl
↑
Move after next element
[
or
⌘
Ctrl
↓
Move before sibling element
⌘
Ctrl
[
or
⌘
Ctrl
←
Move after sibling element
⌘
Ctrl
[
or
⌘
Ctrl
→
Move before parent element
⌘
Ctrl
⇧
↑
Move after parent element
⌘
Ctrl
⇧
↓
Other Shortcuts - Brix Templates

Other

Margin/padding (all sides)
⇧
Drag
Margin/padding (top + bottom or left + right)
Alt
Drag
Select parent/child element
↑
or
↓
Select sibling element
←
or
→
Select next/previous element
⇧
↑
or
↓
Add a class to selected element
⌘
Ctrl
Enter
Duplicate last class on selected element
⌘
Ctrl
Alt
Enter
Rename last class on selected element
⌘
Ctrl
⇧
Enter
Remove last class on selected element
Alt
⇧
Enter
Expand/collapse panel sections
Alt
Click
Toggle collaborators on selected element
⌘
Ctrl
⇧
L
Wrap element in div block
⌘
Ctrl
Alt
G
Wrap element in link block
⌘
Ctrl
Alt
A
Wrap element in H flex
Alt
G
Wrap element in V flex
⌘
Ctrl
G
Unwrap element
⌘
Ctrl
⇧
G
Find Shortcuts - Brix Templates

Find

Quick find
⌘
Ctrl
E
or
⌘
Ctrl
K
Help
⌘
Ctrl
⇧
/