Shortcuts

The list of keyboard shortcuts to build in Webstudio.

Operating system notes

Windows

• Replace command (⌘) with control (Ctrl).

Mac

• On Mac, alt and option are the same key (⌥).

General

• Undo: command + z

• Redo: command + shift + z

• Deselect/abort: esc

Sidebar Left

• Copy: command + c

• Cut: command + x

• Paste: command + v

• Duplicate: command + d

• Open Navigator: z

• Open Add Components: a

• Edit Component: enter

• Expand Navigator item: right arrow

• Collapse Navigator item: left arrow

• Expand all Navigator item children: alt + click

Style Panel

• Open Style Panel: s

• Reset style: alt + click

• Reset style for all corners: shift + alt + click

• Edit spacing on all sides (via drag): shift + drag

• Edit spacing on all sides (via one input): add value to one side, and before closing, use shift + enter

• Edit spacing on two sides (via drag): option + drag

• Edit spacing on two sides (via one input): add value to one side, and before closing, use option + enter

• Increment value by 10: shift + up/down arrow

• Increment value by .1: alt + up/down arrow

Settings Panel

• Open Settings Panel: d

Top Bar

• Preview: command + shift + p

• Switch breakpoints: numbers (e.g., 1 switches to the first one)