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
- Open the menu : Shift + P (mac) or Shift + P (windows)
- 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!
