# Mermaid visual editor shortcuts

The canvas has a short list, which is most of its appeal.

---

## Worth knowing

* The code pane has to have focus for these to work.
* On macOS, Cmd replaces Ctrl throughout.
* Escape closes the search panel and cancels a multi-cursor selection.

---

## Shortcuts

| **Shortcut**          | **Does**                                    |
| --------------------- | ------------------------------------------- |
| Enter                 | Rename the selected element                 |
| Double-click          | Rename, the same as Enter                   |
| Delete                | Delete the selection                        |
| Alt+drag              | Draw a connection between shapes            |
| Escape                | Clear the selection, or cancel a connection |
| Ctrl+Z / Ctrl+Shift+Z | Undo / redo                                 |

---

## A few things that catch people out

* Alt is the difference between moving a node and connecting one.
* Undo works across canvas and code, because both are the same source.
* Escape gets you out of anything.

---

## Related

[Fix Mermaid visual editor problemsMissing buttons and differing canvases.](https://help.gocapable.com/diagrams/fix-mermaid-visual-editor-problems.html)

[Open the Mermaid visual editorA canvas over the top of the text.](https://help.gocapable.com/diagrams/open-the-mermaid-visual-editor.html)

[Mermaid visual editorBack to the editor overview.](https://help.gocapable.com/diagrams/mermaid-visual-editor.html)

---

_Drag it. The text keeps up._