---
title: Keyboard Shortcuts
description: Speed up your Nordcraft development with keyboard commands for navigation, element selection, panel switching and common editing operations.
---

# Keyboard Shortcuts

Keyboard shortcuts in Nordcraft provide quick access to common actions and tools.

## Editor shortcuts

These shortcuts work anywhere in the editor:

- [kbd]T[kbd] - Toggle test mode
- [kbd]I[kbd] - Open the [element catalog](/the-editor/element-tree#element-catalog)
- [kbd]Cmd/Ctrl[kbd] + [kbd]K[kbd]- Open the files view in the [project sidebar](/the-editor/project-sidebar)
- [kbd]Escape[kbd] - Deselect the current element or close panels
- [kbd]Cmd/Ctrl[kbd] + [kbd]scroll[kbd] - Adjust the zoom level of the editor canvas

## Element panel shortcuts

When an element or component is selected in the canvas or element tree:

- [kbd]S[kbd] - Switch to the [style panel](/the-editor/element-panel#style-panel) in the element panel
- [kbd]A[kbd] - Switch to the [attributes panel](/the-editor/element-panel#attributes-panel) in the element panel
- [kbd]E[kbd] - Switch to the [events panel](/the-editor/element-panel#events-panel) in the element panel

## Element tree and canvas shortcuts

- Hold [kbd]Option/Alt[kbd] while **dropping** a dragged element in the element tree to copy the element instead of moving it
- Hold [kbd]Option/Alt[kbd] while **dragging** an element in the canvas to drag a duplicate of the selected element/component instead of moving the original
- Hold [kbd]Cmd/Ctrl[kbd] while **dragging** an element in the canvas to force insertion-mode, which will let you more precisely drop an element, even inside its siblings
- Hold [kbd]Option/Alt[kbd] while **hovering** over elements in the canvas to display distances (in px) between the selected element and other elements or the parent element

## Element editing shortcuts

- [kbd]Cmd/Ctrl[kbd] + [kbd]C[kbd] - Copy selected element/component
- [kbd]Cmd/Ctrl[kbd] + [kbd]V[kbd] - Paste element/component
- [kbd]Cmd/Ctrl[kbd] + [kbd]D[kbd] - Duplicate selected element/component
- [kbd]Cmd/Ctrl[kbd] + [kbd]X[kbd] - Cut selected element/component

## Style panel shortcuts

When an element or component is selected in the canvas or element tree:

- [kbd]Cmd/Ctrl[kbd] + [kbd]S[kbd] - Search for a CSS property
- [kbd]Cmd/Ctrl[kbd] + [kbd]↵[kbd] - Submit CSS property and search for a new CSS property

## Canvas resizing shortcuts

You can use keyboard shortcuts to quickly resize the visible canvas to a variety of different approximate screen sizes. This is useful for testing responsive designs.

- [kbd]1[kbd] - Small mobile device screen size
- [kbd]2[kbd] - Tablet screen size
- [kbd]3[kbd] - Small laptop screen size
- [kbd]4[kbd] - 1080p
- [kbd]5[kbd] - 1440p

## Common operations

- [kbd]Cmd/Ctrl[kbd] + [kbd]Z[kbd] - Undo last action
- [kbd]Cmd/Ctrl[kbd] + [kbd]Shift[kbd] + [kbd]Z[kbd] - Redo last action