---
title: Webflow
date: 2022-11-23 16:23:31.703217
background: bg-[#4450ee]
label:
tags:
  -
  -
categories:
  - Keyboard Shortcuts
intro: |
  A visual cheat-sheet for the 41 keyboard shortcuts found in Webflow
---

## Keyboard Shortcuts

### General

| Shortcut           | Action                   |
| ------------------ | ------------------------ |
| `Shift` `/`        | Show shortcut cheatsheet |
| `Ctrl` `Shift` `S` | Save as a snapshot       |
| `Esc`              | Deselect or abort        |
| `Del`              | Delete element           |
| `Shift` `P`        | Show publish dialog      |
| `Shift` `E`        | Show export code dialog  |
| `Enter`            | Edit element             |

{.shortcuts}

### View

| Shortcut           | Action             |
| ------------------ | ------------------ |
| `Ctrl` `Shift` `P` | Preview mode       |
| `Ctrl` `Shift` `G` | Guide overlay      |
| `Ctrl` `Shift` `E` | Show element edges |
| `Ctrl` `Shift` `X` | X-ray mode         |

{.shortcuts}

### Left-hand Toolbar

| Shortcut           | Action                         |
| ------------------ | ------------------------------ |
| `A`                | Show add panel                 |
| `Z`                | Show navigator tab             |
| `P`                | Show pages panel               |
| `Shift` `A`        | Show symbols panel             |
| `Ctrl` `Shift` `A` | Make selected element a symbol |
| `J`                | Show asset manager             |

{.shortcuts}

### Right-hand Tabs

| Shortcut | Action                 |
| -------- | ---------------------- |
| `S`      | Show style tab         |
| `D`      | Show settings tab      |
| `G`      | Show style manager tab |
| `H`      | Show interactions tab  |

{.shortcuts}

### Copy/Paste

| Shortcut       | Action    |
| -------------- | --------- |
| `Ctrl` `C`     | Copy      |
| `Ctrl` `X`     | Cut       |
| `Ctrl` `V`     | Paste     |
| `Alt` `(drag)` | Duplicate |

{.shortcuts}

### Undo/Redo

| Shortcut           | Action |
| ------------------ | ------ |
| `Ctrl` `Z`         | Undo   |
| `Ctrl` `Shift` `Z` | Redo   |

{.shortcuts}

### Device View

| Shortcut | Action            |
| -------- | ----------------- |
| `1`      | Desktop           |
| `2`      | Tablet            |
| `3`      | Phone (landscape) |
| `4`      | Phone (portrait)  |

{.shortcuts}

### Style Panel

| Shortcut               | Action                                                |
| ---------------------- | ----------------------------------------------------- |
| `Shift` `(drag)`       | Margin or padding (on all sides)                      |
| `Alt` `(drag)`         | Margin or padding (top and bottom, or left and right) |
| `Ctrl` `Enter`         | Add class to selected element                         |
| `Ctrl` `Shift` `Enter` | Rename last class on selected element                 |

{.shortcuts}

### Find

| Shortcut   | Action     |
| ---------- | ---------- |
| `Ctrl` `K` | Quick find |

{.shortcuts}

### Other

| Shortcut           | Action                                   |
| ------------------ | ---------------------------------------- |
| `Alt` `(click)`    | Expand or collapse panel sections        |
| `Up/Down`          | Select parent or child element           |
| `Left/Right`       | Select sibling element                   |
| `Alt` `Left/Right` | Select next or previous element          |
| `Ctrl` `Shift` `L` | Toggle collaborators on selected element |

{.shortcuts}

## Also see

- [Keyboard shortcuts for Webflow](https://university.webflow.com/article/keyboard-shortcuts-in-the-webflow-designer)
  _(university.webflow.com)_