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.

Dev Tools·50 commands·Last updated 2026-07-21

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

V

Move tool

F

Frame tool

R

Rectangle tool

O

Ellipse tool

L

Line tool

T

Text tool

P

Pen tool

K

Slice tool

H

Hand tool

Z

Zoom tool

Layer Operations 10

Cmd+G

Group

Cmd+Shift+G

Ungroup

Cmd+Option+G

Create component

Cmd+Option+B

Create component instance

Cmd+]

Move up one layer

Cmd+[

Move down one layer

Cmd+Shift+]

Bring to front

Cmd+Shift+[

Send to back

Cmd+Option+↑

Move up 10px

Cmd+Option+↓

Move down 10px

Align & Distribute 8

Alt+A

Align left

Alt+D

Align right

Alt+W

Align top

Alt+S

Align bottom

Alt+H

Center horizontally

Alt+V

Center vertically

Ctrl+Alt+H

Distribute horizontally with equal spacing

Ctrl+Alt+V

Distribute vertically with equal spacing

Styles & Properties 7

Cmd+T

Transform (scale/rotate)

Cmd+Shift+T

Create style

Cmd+Option+S

Apply style

Cmd+Option+C

Copy style

Cmd+Option+V

Paste style

Cmd+Shift+R

Resize

Cmd+Option+K

Add constraints

Other Common 7

Cmd+C / Cmd+V

Copy / paste

Cmd+D

Copy and paste (in place)

Cmd+Shift+D

Copy properties

Cmd+Shift+V

Paste to selection

Cmd+Option+E

Export

Cmd+/

Cmd+Option+P

Run plugin

Parameter matrix

Parameter	Effect	Example
`V`	切换到移动工具	`V`
`F`	切换到画框工具（Frame）	`F`
`R / O / L`	矩形、椭圆、线条工具	`R`
`T / P / K`	文本、钢笔、切片工具	`T`
`H / Z`	抓手平移、缩放工具	`H`
`Cmd+G`	把选中图层编组	`Cmd+G`
`Cmd+Shift+G`	取消编组	`Cmd+Shift+G`
`Cmd+Option+G`	把选中图层创建为组件	`Cmd+Option+G`
`Cmd+Option+B`	创建组件实例	`Cmd+Option+B`
`Cmd+] / Cmd+[`	上移一层 / 下移一层	`Cmd+]`
`Cmd+Shift+] / Cmd+Shift+[`	移到顶层 / 移到底层	`Cmd+Shift+]`
`Cmd+Option+↑ / ↓`	向上 / 向下精确移动 10px	`Cmd+Option+↑`
`Alt+A / Alt+D`	左对齐 / 右对齐	`Alt+A`
`Alt+W / Alt+S`	顶对齐 / 底对齐	`Alt+W`
`Alt+H / Alt+V`	水平居中 / 垂直居中	`Alt+H`
`Ctrl+Alt+H / Ctrl+Alt+V`	水平等距分布 / 垂直等距分布	`Ctrl+Alt+H`
`Cmd+Shift+T`	把当前属性创建为样式	`Cmd+Shift+T`
`Cmd+Option+S`	应用已有样式	`Cmd+Option+S`
`Cmd+Option+C / V`	复制样式 / 粘贴样式到其他图层	`Cmd+Option+C`
`Cmd+Shift+R`	调整尺寸	`Cmd+Shift+R`
`Cmd+Option+K`	添加约束以适配不同尺寸	`Cmd+Option+K`
`Cmd+0 / Cmd+1 / Cmd+2`	缩放至 100% / 适应画布 / 选区	`Cmd+1`
`Shift+1`	缩放到主组件视图	`Shift+1`
`Space+拖拽`	临时平移画布	`Space+拖拽`
`Cmd+Option+\`	显示或隐藏 Figma 界面	`Cmd+Option+\`
`Cmd+Option+1 / 2`	显示或隐藏图层面板 / 属性面板	`Cmd+Option+2`
`Cmd+D`	原位复制粘贴选中图层	`Cmd+D`
`Cmd+Shift+D`	复制属性（不复制图层结构）	`Cmd+Shift+D`
`Cmd+Shift+V`	粘贴到当前选区内部	`Cmd+Shift+V`
`Cmd+Option+E`	导出当前帧或图层	`Cmd+Option+E`
`Cmd+/`	搜索命令、图层与资源	`Cmd+/`
`Cmd+Option+P`	运行已安装的插件	`Cmd+Option+P`

Common pitfalls

Symptom图层面板里图层太多，找不到目标，只能靠肉眼一个个点

Cause没有用编组做结构分层，所有图层平铺在同一层

Fix用 Cmd+G 按区块编组，双击进入组内编辑，把层级收敛成可读的树

Symptom复制一个按钮后改不动，改动会牵连到其他页面

Cause按钮是主组件本体而不是实例，编辑主组件会全局同步

Fix用 Cmd+Option+B 创建组件实例，改样式时先确认选中的是实例而非主组件

Symptom几十个按钮的圆角、字号各不相同，改一次要挨个点

Cause没有建立样式，图层上填的是各自独立的原始值

Fix用 Cmd+Shift+T 把常用属性提为样式，再用 Cmd+Option+S 批量套用

Symptom切到手机尺寸后按钮文字溢出、间距被挤乱

Cause图层没有设置约束，默认按固定尺寸缩放

Fix选中图层后用 Cmd+Option+K 添加约束，让元素跟随容器拉伸或对齐

Symptom撤销几次之后想找回最初的图层结构，却发现回不去了

CauseCmd+D、Cmd+G 这类操作在 Figma 里会合并成较大的撤销步骤

Fix结构性大改动前先 Cmd+Option+S 存一个版本文件，或用 Cmd+Z 逐步回退并立刻截图确认

Symptom粘贴过来的图层跑到很远的位置，对不上原来的画框

Cause粘贴保持原坐标，而目标画框在别的位置

Fix用 Cmd+Shift+V 粘贴到当前选区内部，或粘贴后用 Cmd+Option+↑/↓ 与对齐快捷键归位

Symptom录屏演示时图层面板一直在闪，想给客户看纯画面

Cause没有隐藏 Figma 自身的界面

Fix按 Cmd+Option+\ 隐藏全部 UI，或单独用 Cmd+Option+1、Cmd+Option+2 收起面板

Troubleshooting

1快速找到某个图层或命令
Cmd+/
输入图层层级路径或命令名，直接跳转；比在图层面板里逐层展开快得多。
2把散落的元素按区块收进结构里
Cmd+G
框选后编组，再双击进入组内编辑，改层级时不再需要先取消编组重编。
3把重复元素收成可复用组件
Cmd+Option+G
选中主图层创建组件，其他位置用 Cmd+Option+B 生成实例后再单独改。
4让一组元素间距完全一致
Ctrl+Alt+H
选中三个以上元素后执行，水平方向等距分布；纵向换 Ctrl+Alt+V。
5修正复制来的图层位置
Cmd+Option+↓
按 10px 步进微调，配合 Alt+A、Alt+H 等对齐快捷键快速归位。
6查看一个实例背后的主组件长什么样
Shift+1
缩放到主组件视图，确认组件本身的默认值与结构是否正确。
7交付前导出当前画框
Cmd+Option+E
导出面板可选择倍率与格式，切片工具 K 可以先切好多个导出区域。

Command Examples

Group first, then align, instead of dragging one by one

Cmd+G // 编组
Alt+A // 左对齐
Alt+H // 水平居中
Alt+V // 垂直居中

Align 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 // 水平等距分布
Ctrl+Alt+V // 垂直等距分布

Distribution 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 // 创建样式（从选中属性生成）
Cmd+Option+S // 应用样式
Cmd+Option+C // 复制样式
Cmd+Option+V // 粘贴样式

When 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 // 复制并粘贴（原位）
Cmd+Shift+D // 复制属性

Cmd+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 // 缩放至 100%
Cmd+1 // 缩放至适应
Cmd+2 // 缩放至选区
Shift+1 // 缩放至主组件

Cmd+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.

Figma Help

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.