Figma实用小技巧

1. 介绍

原作：草帽 视频地址
文字版整理：岩鸣杨子

2. 快速拖拽调整数值

按住option可在数值上拖拽调整，不按option时只能在X/Y/W/H/旋转/圆角等的图标上拖拽调整，不能调整透明度的数值。

3. 属性粘贴复制

shift+X：互换填充和描边
选中图层的某个属性，然后cmd+C，则可复制这个图层特定的属性。
选中图层的某个属性，然后cmd+V，则可粘贴到这个图层特定的属性上。

4. 列表切换&快速搜索

option+1：切换到Layers
option+2：切换到Assets，并自动进入搜索状态
cmd+/：全局搜索

5. 基础操作疯狂用

shift+1：显示所有设计图
按住Z：显示放大镜，然后拖拽出一片区域放大显示
shift+2：对当前元素放大显示

6. Framer必知高效技巧

cmd+option+G：把选中的几个元素放进Frame里
按住cmd时拖动frame边框可以忽略里面的元素位置调整frame大小
按住cmd+option时拖动frame边框可以对称地调整frame大小

7. 组件库快速替换

单独替换里面的一个组件：按住option+cmd，从assets里面拖入。

8. 取消组件

option+cmd+B：分离实例（注：原始组件不能被取消。如需将组件恢复成Frame，可以先复制一个实例出来，然后按此快捷键分离实例，再将原始组件删除即可。）
cmd+G：编组
shift+cmd+G：取消编组

9. 展开收起图层列表

收起option+L，选择某个图层可单独收起该图层

10. 图层上下级选择

回车键：选择组名，然后按回车键就能选中组内所有图层
shift+回车：从下级往上级选

11. 等分的宽度计算技巧

点右边Layout Grid，选择Columns(列），调整好数值。选中所需要自动调整宽度的图层，将右边constraints调成“left&right”，图层就能跟随grid自动调整宽度。

12. 快速调整图层透明度

直接按数字键，图层就能改成相应透明度。

13. 快速调整位置对齐&对称

option+W/A/S/D：移动到上/左/下/右边缘
option+V：垂直居中
option+H：水平居中
shift+V：上下翻转
shift+H：左右翻转

14. 快速实时预览颜色

control+C

15. 参考线、布局的显示隐藏快捷键

control+G：显示/隐藏栅格或网格
shift+R：显示/隐藏标尺及参考线

16. 用Figma制作简单可外链的“真实”网页

在prototype的interaction里选一种交互方式，然后选Open Link，输入网址。

17. 从图层快速定位到设计稿

shift+2，或双击图层图标

18. 批量添加图片

cmd+shift+K

19. 批量重命名

cmd+R

20. 善用加减乘除调整位置

数值框内可直接进行加减乘除计算。

21. 手动在历史快照中添加自己标记的历史版本

点击文件名右边小箭头，展开下拉列表，选择Show Version History即可在右边显示出Version History，点右边小加号添加一个版本。也可用快捷键cmd+option+S。

22. 需要付费的团队组件库

付费版$15/月，可以调用其他文件里的组件库。免费版只能同步样式，不能同步组件库。

23. 样式分类管理

用“/”分组