Figma Cheatsheet - UI Design Tool Shortcut Reference
Where Figma loses time is repetition: the same alignment, the same spacing tweak, the same tool switch, repeated dozens of times inside one file. This table groups by tool switching, layer operations, alignment and distribution, styles and properties, view and navigation, and other common shortcuts, collecting the key combinations that replace mouse work along with the constraints nobody remembers without writing them down. The judgment rule is whether the layer tree is still readable: once dozens of similar elements sit ungrouped at the top level, every later alignment becomes painful, so group each finished module and keep nesting to two levels. Reach for it when you need a reviewable draft in half an hour, when normalizing components in a design system, or when preparing annotation and export handoff for developers. Compared with drawing and adjusting in the same pass, settling the auto-layout spacing rules first means a later change edits one number instead of reflowing the whole block.
Typical Use Case
For designers who need to move fast on interface mockups, component libraries and interactive prototypes. The shortcuts are grouped into six sets — tools, layers, alignment, style properties, view navigation and everything else — so the list doubles as a memory drill. Three habits pay off first: switching tools with single letter keys, grouping with Cmd+G instead of rebuilding structure, and building reusable styles so spacing and corner radii stop drifting across dozens of layers.
Tool Switching 10
VFROLTPKHZLayer Operations 10
Cmd+GCmd+Shift+GCmd+Option+GCmd+Option+BCmd+]Cmd+[Cmd+Shift+]Cmd+Shift+[Cmd+Option+↑Cmd+Option+↓Align & Distribute 8
Alt+AAlt+DAlt+WAlt+SAlt+HAlt+VCtrl+Alt+HCtrl+Alt+VStyles & Properties 7
Cmd+TCmd+Shift+TCmd+Option+SCmd+Option+CCmd+Option+VCmd+Shift+RCmd+Option+KOther Common 7
Cmd+C / Cmd+VCmd+DCmd+Shift+DCmd+Shift+VCmd+Option+ECmd+/Cmd+Option+PParameter matrix
| Parameter | Effect | Example |
|---|---|---|
V | Switch to the Move tool | V |
F | Switch to the Frame tool | F |
R / O / L | Rectangle, ellipse, and line tools | R |
T / P / K | Text, pen, and slice tools | T |
H / Z | Hand pan and zoom tools | H |
Cmd+G | Group the selected layers | Cmd+G |
Cmd+Shift+G | Ungroup | Cmd+Shift+G |
Cmd+Option+G | Create the selected layers as a component | Cmd+Option+G |
Cmd+Option+B | Create a component instance | Cmd+Option+B |
Cmd+] / Cmd+[ | Bring forward / send backward | Cmd+] |
Cmd+Shift+] / Cmd+Shift+[ | Bring to front / send to back | Cmd+Shift+] |
Cmd+Option+↑ / ↓ | Nudge up / down 10px | Cmd+Option+↑ |
Alt+A / Alt+D | Align left / align right | Alt+A |
Alt+W / Alt+S | Align top / align bottom | Alt+W |
Alt+H / Alt+V | Align horizontal centers / align vertical centers | Alt+H |
Ctrl+Alt+H / Ctrl+Alt+V | Distribute horizontally / distribute vertically | Ctrl+Alt+H |
Cmd+Shift+T | Create the current properties as a style | Cmd+Shift+T |
Cmd+Option+S | Apply an existing style | Cmd+Option+S |
Cmd+Option+C / V | Copy style / paste style to other layers | Cmd+Option+C |
Cmd+Shift+R | Resize | Cmd+Shift+R |
Cmd+Option+K | Add constraints to adapt to different sizes | Cmd+Option+K |
Cmd+0 / Cmd+1 / Cmd+2 | Zoom to 100% / fit canvas / fit selection | Cmd+1 |
Shift+1 | Zoom to the main component view | Shift+1 |
Space+drag | Temporarily pan the canvas | Space+drag |
Cmd+Option+\ | Show or hide the Figma UI | Cmd+Option+\ |
Cmd+Option+1 / 2 | Show or hide the layers panel / properties panel | Cmd+Option+2 |
Cmd+D | Duplicate and paste the selected layers in place | Cmd+D |
Cmd+Shift+D | Copy properties (without copying the layer structure) | Cmd+Shift+D |
Cmd+Shift+V | Paste inside the current selection | Cmd+Shift+V |
Cmd+Option+E | Export the current frame or layer | Cmd+Option+E |
Cmd+/ | Search commands, layers, and resources | Cmd+/ |
Cmd+Option+P | Run installed plugins | Cmd+Option+P |
Common pitfalls
SymptomThe layers panel has too many layers, you cannot find the target and have to click through them by eye.
CauseNo grouping was used for structural hierarchy, so all layers lie flat on the same level.
FixUse Cmd+G to group by section, double-click to edit inside a group, and condense the hierarchy into a readable tree.
SymptomAfter copying a button it cannot be changed, and edits ripple to other pages.
CauseThe button is the main component itself rather than an instance, so editing the main component syncs globally.
FixUse Cmd+Option+B to create a component instance, and when changing styles first confirm you selected the instance rather than the main component.
SymptomDozens of buttons have different corner radii and font sizes, and changing them takes clicking each one.
CauseNo styles were established; the layers carry independent raw values.
FixUse Cmd+Shift+T to promote common properties into styles, then Cmd+Option+S to apply them in bulk.
SymptomAfter switching to phone size, button text overflows and spacing gets squeezed.
CauseThe layer has no constraints set and scales at a fixed size by default.
FixAfter selecting the layer use Cmd+Option+K to add constraints so elements stretch or align with the container.
SymptomAfter several undos you try to recover the original layer structure but cannot get back.
CauseOperations like Cmd+D and Cmd+G are merged into larger undo steps in Figma.
FixBefore major structural changes, save a version file with Cmd+Option+S, or step back with Cmd+Z and screenshot immediately to confirm.
SymptomA pasted layer lands far away and does not line up with the original frame.
CausePaste keeps the original coordinates, while the target frame is elsewhere.
FixUse Cmd+Shift+V to paste inside the current selection, or after pasting use Cmd+Option+↑/↓ and alignment shortcuts to reposition.
SymptomDuring a screen-recording demo the layers panel keeps flashing and you want a clean view for the client.
CauseFigma's own UI was not hidden.
FixPress Cmd+Option+\ to hide all UI, or collapse panels individually with Cmd+Option+1 and Cmd+Option+2.
Troubleshooting
1Quickly find a layer or command
Cmd+/Type the layer hierarchy path or command name to jump directly; much faster than expanding the layers panel level by level.
2Consolidate scattered elements into a structure by section
Cmd+GGroup after marquee-selecting, then double-click to edit inside the group; changing hierarchy no longer requires ungrouping and regrouping first.
3Turn repeated elements into reusable components
Cmd+Option+GSelect the main layer to create a component, then use Cmd+Option+B elsewhere to generate instances and modify them separately.
4Make the spacing of a group of elements exactly even
Ctrl+Alt+HSelect three or more elements and run it to distribute evenly horizontally; use Ctrl+Alt+V for vertical.
5Fix the position of a copied layer
Cmd+Option+↓Nudge in 10px steps, and reposition quickly with alignment shortcuts such as Alt+A and Alt+H.
6See what the main component behind an instance looks like
Shift+1Zoom to the main component view and confirm the component's own default values and structure are correct.
7Export the current frame before delivery
Cmd+Option+EThe export panel lets you choose scale and format; the slice tool K lets you pre-cut multiple export regions.
Command Examples
Group first, then align, instead of dragging one by one
Cmd+G // group
Alt+A // align left
Alt+H // align horizontal centers
Alt+V // align vertical centersAlign applies to every selected object, measured against the selection bounding box. If a background rect or a guide sneaks into the selection, it dictates the result — so group the cards with Cmd+G first, then align.
Distribute needs at least three objects
Ctrl+Alt+H // distribute horizontally
Ctrl+Alt+V // distribute verticallyDistribution equalizes the gaps while keeping the two ends fixed. Two objects have no "middle", so distribute is meaningless there — duplicate one to get a third before you expect it to work.
Extract a style once, apply it everywhere else
Cmd+Shift+T // create style (from selected properties)
Cmd+Option+S // apply style
Cmd+Option+C // copy style
Cmd+Option+V // paste styleWhen creating a style you can target a single layer or a component instance. Target a layer and you get a local style; target an instance and you get a global style reusable elsewhere. For a design system where one color change must propagate, you need the global one.
Duplicate in place and copy properties
Cmd+D // duplicate and paste (in place)
Cmd+Shift+D // copy propertiesCmd+D keeps the original absolute position and stacks the copy on top, which suits in-place variants. Cmd+Shift+D moves only fill, stroke, and effects onto a layer that already has its own layout. Together they are the shortest route to "same card, different state".
Three zoom presets cure canvas drift
Cmd+0 // zoom to 100%
Cmd+1 // zoom to fit
Cmd+2 // zoom to selection
Shift+1 // zoom to main componentCmd+2 zooms to the selection — the fastest way to review a detail. Cmd+1 pulls back for the big picture, and Shift+1 jumps from an instance to its main component to see what it inherits. Space-drag pans; these presets frame the shot, so you rarely need the zoom widget at all.
Common Pitfalls
- Whether Cmd+Shift+T creates a local or a global style depends on whether the target at creation time was a layer or a component instance. Pick wrong and your other instances stop responding.
- Editing a main component already published to a team library bypasses versioning and review, and the change hits every consumer instantly. Change it in Draft first, then publish.
- Align and distribute measure against the selection bounding box; one oversized stray layer skews everything. Inspect the selection with Cmd+/ or Cmd+Shift+A before acting.
- Cmd+Shift+V (paste to selection) resizes and re-constrains against the target and can overwrite its existing layout settings. Verify with Cmd+Z.
- Figma merges via CRDT: an offline edit to the same layer as a colleague keeps both versions and merges automatically, and the result often matches neither intent. Keep Presence on for anything under review.
- Hiding the layers panel with Cmd+Option+1 / 2 is disorienting. Only the UI is hidden, not the objects, and alignment still measures against frames you can no longer see.
Tips
- After Cmd+G grouping, double-click to edit inside the group - more efficient than ungrouping and regrouping.
- Alt+drag duplicates a layer; add Cmd for precise duplication.
- Components are Figma's core; design systems must use components.
FAQ
When should I group elements in Figma, and when should I make a component?
Grouping with Cmd + G (undo with Cmd + Shift + G) simply bundles layers so you can move them and toggle visibility together — it is visual organisation, not reuse. Components, created with Cmd + Option + G and instanced from the properties panel with Cmd + Option + B, are the backbone of a design system: editing the main component updates every instance and supports variants and properties. The rule of thumb: if it will be reused, make it a component; if you only want tidier layers, group them. Double-click to enter a group for direct editing — faster than ungrouping and rebuilding.
How do I align and evenly distribute a group of layers?
Alignment lives on Alt: Alt+A left, Alt+D right, Alt+W top, Alt+S bottom, Alt+H horizontal centre and Alt+V vertical centre, all requiring a multi-layer selection. Distribution is a different set: Ctrl+Alt+H spaces layers evenly horizontally and Ctrl+Alt+V vertically, and both only make sense with three or more layers selected. For fine nudging use Cmd+Option+↑ and Cmd+Option+↓ to move by 10px.
Should I use styles, copy properties, or a plain copy-paste?
Cmd + Shift + R creates a reusable style for fills, type, shadows and effects, which you then apply with Cmd + Option + S, copy with Cmd + Option + C and paste with Cmd + Option + V. Cmd + Shift + D copies properties only — visual attributes without the layer content — which is the fastest way to spread a colour and effect set across another shape. Cmd + C / Cmd + V copies the whole layer, Cmd + D duplicates in place, and Cmd + Shift + V pastes inside the current selection.
How do I control zoom and hide the Figma panels?
Zooming uses the Cmd number keys: Cmd + 0 returns to 100%, Cmd + 1 zooms to fit, Cmd + 2 zooms to the current selection and Shift + 1 zooms to the main component. Press Z to arm the zoom tool for freehand zooming, and hold Space while dragging to pan the canvas. To declutter, Cmd+Option+\ toggles the whole UI, while Cmd+Option+1 and Cmd+Option+2 individually toggle the layers and properties panels. Hiding everything is the cleanest full-screen presentation mode.
How do I move layers precisely and keep spacing identical across shapes?
Arrow keys combined with Shift give constrained moves and resizes, and the properties panel shows the exact numbers. For bulk nudging, Cmd+Option+↑ and Cmd+Option+↓ shift a layer by 10px, which beats holding an arrow key one pixel at a time. Cmd + T opens the transform panel for exact scale and rotation values, and Cmd + Shift + R resizes directly. Leave alignment to Alt+A / D / W / S / H / V, and to Ctrl+Alt+H / V when the spacing itself must be even — manual dragging will never match.
Official References
Each command links to its official documentation below, so you can verify the latest usage and read deeper.
Maintained by LaoHand
Publicly updated on Jul 21, 2026, continuously proofread against official docs.
Contact Us
Wrong command or description? Send us corrections, business inquiries or product feedback by email.
Contact Us