Webflow keyboard shortcuts

Webflow

Zeynel Öztürk -
5 years ago
- Shortcuts

While Webflow doing the hard work of writing code for you, why don't you memorize some of these keyboard shortcuts to make things faster?

1
↑  Shift + /

Show shortcut list

0
↑  Shift + Ctrl + S

Save as snapshot

1
↑  Shift + ⌘ Cmd + S

Save as snapshot (Mac)

0
Esc

Deselect / abort

0
Del

Delete element

0
↑  Shift + P

Show Publish dialog

0
↑  Shift + E

Show Export Code dialog

0
⤶ Enter

Edit element

Advertisement

0
↑  Shift + Ctrl + P

Preview mode

0
↑  Shift + ⌘ Cmd + P

Preview mode (Mac)

1
↑  Shift + Ctrl + G

Guide overlay

0
↑  Shift + ⌘ Cmd + G

Guide overlay (Mac)

0
↑  Shift + Ctrl + E

Show element edges

0
↑  Shift + ⌘ Cmd + E

Show element edges (Mac)

0
↑  Shift + Ctrl + X

X-ray mode

0
↑  Shift + ⌘ Cmd + X

X-ray mode (Mac)

0
A

Show Add panel

0
P

Show Pages panel

0
↑  Shift + A

Show Symbols panel

0
Ctrl + ↑  Shift + A

Make selected element a Symbol

0
⌘ Cmd + ↑  Shift + A

Make selected element a Symbol (Mac)

0
J

Show Asset Manager

0
S

Show Style tab

0
D

Show Settings tab

0
F

Show Navigator tab

0
G

Show Style Manager tab

0
H

Show Interactions tab

0
Ctrl + C

Copy

0
⌘ Cmd + C

Copy (Mac)

0
Ctrl + X

Cut

0
⌘ Cmd + X

Cut (Mac)

0
Ctrl + V

Paste

0
⌘ Cmd + V

Paste (Mac)

0
Alt +
+

Duplicate

0
1

Desktop

0
2

Tablet

0
3

Phone (landscape)

0
4

Phone (portrait)

0
↑  Shift +
+

Margin / padding (all sides)

0
Alt +
+

Margin / padding (top - bottom or left - right )

0
Ctrl + ⤶ Enter

Add class to selected element

0
⌘ Cmd + ⤶ Enter

Add class to selected element (Mac)

0
Ctrl + ↑  Shift + ⤶ Enter

Rename last class on selected element

0
⌘ Cmd + ↑  Shift + ⤶ Enter

Rename last class on selected element (Mac)

0
Alt +

Expand / collapse panel sections

0
  

Select parent / child element

0
  

Select sibling element

Advertisement

0
Alt +   

Select next / previous element

0
Ctrl + ↑  Shift + L

Toggle collaborators on selected element

0
⌘ Cmd + ↑  Shift + L

Toggle collaborators on selected element (Mac)

0
Ctrl + E

Quick find

0
or Ctrl + K
0
⌘ Cmd + E

Quick find (Mac)

0
or ⌘ Cmd + K
  Source: webflow

Share this page on:
Is this page helpful?
0 0

Program information

Program name: Webflow Webflow (Web applications)

Webflow is a web-based website building tool. It can be used by designers without code knowledge. While using the tool, Webflow automatically generates HTML, CSS, and JavaScript.

Web page: webflow.com

Last update: 11/11/2019 8:10 PM UTC

How easy to press shortcuts: 86%

More information >>

Shortcut count: 58

Platform detected: Windows and macOS mixed

Similar programs




What is your favorite Webflow hotkey? Do you have any useful tips for it? Let other users know below.


 
No comments yet. Ask, or type the first one!