Webflow keyboard shortcuts

Webflow

Zeynel Abidin Öztürk -
2 months 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?

↑   Shift + /

Show shortcut list

↑   Shift + Ctrl + S

Save as snapshot

↑   Shift + ⌘ Cmd + S

Save as snapshot (Mac)

Esc

Deselect / abort

Del

Delete element

↑   Shift + P

Show Publish dialog

↑   Shift + E

Show Export Code dialog

⤶ Enter

Edit element

↑   Shift + Ctrl + P

Preview mode

↑   Shift + ⌘ Cmd + P

Preview mode (Mac)

↑   Shift + Ctrl + G

Guide overlay

↑   Shift + ⌘ Cmd + G

Guide overlay (Mac)

↑   Shift + Ctrl + E

Show element edges

↑   Shift + ⌘ Cmd + E

Show element edges (Mac)

↑   Shift + Ctrl + X

X-ray mode

↑   Shift + ⌘ Cmd + X

X-ray mode (Mac)

A

Show Add panel

P

Show Pages panel

↑   Shift + A

Show Symbols panel

Ctrl + ↑   Shift + A

Make selected element a Symbol

⌘ Cmd + ↑   Shift + A

Make selected element a Symbol (Mac)

J

Show Asset Manager

S

Show Style tab

D

Show Settings tab

F

Show Navigator tab

G

Show Style Manager tab

H

Show Interactions tab

Ctrl + C

Copy

⌘ Cmd + C

Copy (Mac)

Ctrl + X

Cut

⌘ Cmd + X

Cut (Mac)

Ctrl + V

Paste

⌘ Cmd + V

Paste (Mac)

Alt + Mouse left click + Mouse movement

Duplicate

1

Desktop

2

Tablet

3

Phone (landscape)

4

Phone (portrait)

↑   Shift + Mouse left click + Mouse movement

Margin / padding (all sides)

Alt + Mouse left click + Mouse movement

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

Ctrl + ⤶ Enter

Add class to selected element

⌘ Cmd + ⤶ Enter

Add class to selected element (Mac)

Ctrl + ↑   Shift + ⤶ Enter

Rename last class on selected element

⌘ Cmd + ↑   Shift + ⤶ Enter

Rename last class on selected element (Mac)

Alt + Mouse left click

Expand / collapse panel sections

↑  ↓

Select parent / child element

←  →

Select sibling element

Alt + ←  →

Select next / previous element

Ctrl + ↑   Shift + L

Toggle collaborators on selected element

⌘ Cmd + ↑   Shift + L

Toggle collaborators on selected element (Mac)

Ctrl + E

Quick find

or Ctrl + K
⌘ Cmd + E

Quick find (Mac)

or ⌘ Cmd + K
  Source: webflow

Share this page on:

Program information

Program name: 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: https://webflow.com

Shortcut count: 58

Similar programs


  1. Keyboard symbolsKeyboard symbols
    34571    1
  2. Apex Legends (PC)Apex Legends (PC)
    29861   
  3. Fortnite (PC)Fortnite (PC)
    28586    2
  4. PlayerUnknown's BattlegPlayerUnknown's Battleg
    26212    2
  5. Grand Theft Auto VGrand Theft Auto V
    23859   
  6. SketchUpSketchUp
    22643   
More keyboard shortcuts...

Latest articles

Advertisement

  Subscribe to our mailing list!

Useful technology tips and keyboard shortcuts will appear in your inbox.

Your email is kept private and we don't spam.

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