12 keyboard shortcuts to create faster on Webflow

Documentation
3 min
Published on Dec 17, 2021
Updated on
A hand pointing at a computer keyboard with a white Webflow logo in the background.
Use AI to summarize this article
Key points

I love productivity.

Optimizing your time is (in my opinion) super important! And what about you?

In this article, I have compiled a list of some keyboard shortcuts that will allow you to create more quickly in Webflow! 🏎

General Shortcuts

  • Copy an element: Command + C (mac) or Control + C (windows)
  • Paste an element: Command + V (mac) or Control + V (windows)
  • Undo the last action: Command + Z (mac) or Control + Z (windows)

Adding Elements

  • Add an element (A): Command + E (mac) or Control + E (windows)

Styling

  • Assign a class to an element: Command + enter (mac) or Control + enter (windows)
  • Change the spacing format for all four sides at once: Shift + drag (mac) or Shift + drag (windows)
  • Modify horizontal or vertical spacing only: Option + drag (mac) or Alt + drag (windows)
  • Change dynamic page: Shift + option + ◀️ ▶️ (mac) or Shift + Alt + ◀️ ▶️ (windows)

Responsive Display: Device View

With a single click, switch between different display formats! From computer to mobile, adapt your design to all formats! (Reminder: over 50% of global traffic comes from smartphones)

  • Computer: 1
  • Tablet: 2
  • Phone (landscape): 3
  • Phone (portrait): 4

Bonus

Publish your Webflow site

  1. Open the menu  : Shift + P (mac) or Shift + P (windows)
  2. Publish it  : Shift + enter (mac) or Shift + enter (windows)

Find more of our Webflow tutorials and tips on our blog.

Bonus: Create your own keyboard shortcut in Webflow or Design more efficiently in Figma with these keyboard shortcuts!

Florian Bodelot
Florian Bodelot
Co-founder

Suggested articles

Illustration of Webflow and Claude connection with graphic elements and data network
Tutorial
AI

How to easily connect Claude to your Webflow project?

How to easily connect Claude to your Webflow project?
Webflow AI interface with a centered badge on a blue and purple gradient background.
Documentation
AI

AI in Webflow in 2026: 10 features, from the simplest to the most advanced

AI in Webflow in 2026: 10 features, from the simplest to the most advanced
Minimal dark landing page displaying “The Digidop Company” with the tagline “Build. Scale. Inspire.” and the Digidop and Vydera logos at the bottom.
News
Digidop

A new step for Digidop: The Digidop Company and the launch of Vydera

A new step for Digidop: The Digidop Company and the launch of Vydera

Want to turn your website into your most valuable asset?

Contact us today