Keyboard shortcuts in Webflow - Webflow University Documentation

Use keyboard shortcuts in Webflow to make your workflow as efficient as possible.

Keyboard shortcuts in Webflow - Webflow University Documentation

Webflow

A visual cheat-sheet for the 41 keyboard shortcuts found in Webflow

Reference Link

Overview

Total Shortcuts: 41

  • General:7 shortcuts
  • View:4 shortcuts
  • Left-hand Toolbar:6 shortcuts
  • Right-hand Tabs:4 shortcuts
  • Copy/Paste:4 shortcuts
  • Undo/Redo:2 shortcuts
  • Device View:4 shortcuts
  • Style Panel:4 shortcuts
  • Find:1 shortcuts
  • Other:5 shortcuts

General

  • Show shortcut cheatsheetShift + /
  • Save as a snapshotCtrl + Shift + S
  • Deselect or abortEsc
  • Delete elementDel
  • Show publish dialogShift + P
  • Show export code dialogShift + E
  • Edit elementEnter

View

  • Preview modeCtrl + Shift + P
  • Guide overlayCtrl + Shift + G
  • Show element edgesCtrl + Shift + E
  • X-ray modeCtrl + Shift + X

Left-hand Toolbar

  • Show add panelA
  • Show navigator tabZ
  • Show pages panelP
  • Show symbols panelShift + A
  • Make selected element a symbolCtrl + Shift + A
  • Show asset managerJ

Right-hand Tabs

  • Show style tabS
  • Show settings tabD
  • Show style manager tabG
  • Show interactions tabH

Copy/Paste

  • CopyCtrl + C
  • CutCtrl + X
  • PasteCtrl + V
  • DuplicateAlt + (drag)

Undo/Redo

  • UndoCtrl + Z
  • RedoCtrl + Shift + Z

Device View

  • Desktop1
  • Tablet2
  • Phone (landscape)3
  • Phone (portrait)4

Style Panel

  • Margin or padding (on all sides)Shift + (drag)
  • Margin or padding (top and bottom, or left and right)Alt + (drag)
  • Add class to selected elementCtrl + Enter
  • Rename last class on selected elementCtrl + Shift + Enter

Find

  • Quick findCtrl + K

Other

  • Expand or collapse panel sectionsAlt + (click)
  • Select parent or child elementUp/Down
  • Select sibling elementLeft/Right
  • Select next or previous elementAlt + Left/Right
  • Toggle collaborators on selected elementCtrl + Shift + L

Startup.detail.introduction

The text appears to be a documentation page from Webflow University, which provides information on keyboard shortcuts available in Webflow, a design and development tool. The page lists various shortcuts categorized by functionality, such as:

  1. General shortcuts
  2. View shortcuts
  3. Left-hand toolbar shortcuts
  4. Right-hand tabs shortcuts
  5. Copy/paste shortcuts
  6. Undo/redo shortcuts
  7. Device view shortcuts
  8. Style panel shortcuts
  9. Other shortcuts
  10. Find shortcuts
  11. Move element shortcuts
  12. Markdown shortcuts
  13. Flex and grid layout shortcuts

Each category lists specific keyboard shortcuts that can be used to perform various actions in Webflow, such as selecting elements, moving elements, copying and pasting, undoing and redoing actions, and more. The page also provides a table of contents and links to other related documentation pages.