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

Citation rate by AI platform: ChatGPT 100%, Perplexity 100%, Gemini 67%, and Claude 0%.
Documentation
AI

Make Your Website Visible in ChatGPT, Perplexity, and AI Answers

Make Your Website Visible in ChatGPT, Perplexity, and AI Answers
Florian Bodelot and Thomas Labonne from Digidop in front of a Webflow Conf 2026 visual announcing their trip to Boston.
Events
Webflow

Webflow Conf 2026: A Particularly Anticipated Edition

Webflow Conf 2026: A Particularly Anticipated Edition
Historical fund performance chart on an asset management company fund page
Documentation
Development

Fund Pages: How to Structure an Asset Management Company’s Fund Range on its Website

Fund Pages: How to Structure an Asset Management Company’s Fund Range on its Website
Every great website  
starts with a conversation
Abstract composition of black and gold metallic ribbons with elegant light reflections and smooth gradients. A premium background conveying luxury, modernity, and innovation.