Figma菜鸟教程：色彩+团队色彩复用方法

一：色彩介绍

1、认识Figma色彩

绘制一个形状，右侧属性栏看到填充色值；单击在颜色弹框中可以任意调整颜色。

颜色面板

这个“小水滴”icon就是图层样式入口：

图层样式入口

点击“小水滴”icon，就可以看到各种图层样式，正片叠底、绿色、叠加、柔光、强光等等。

图层也支持各种图层样式。

图层也支持图层样式

2、吸取颜色方法：

方法1：吸取颜色：Ctrl+C；（和Sketch中吸色快捷键一样。）

方法2：快捷键I；（同AI中吸色快捷键一样。）

吸取颜色

3、快速调整颜色：

按住键盘的上、下键，可以快速移动颜色值修改颜色；

并且在“下”时，颜色会往右下；在“上”时，颜色会往左上。 在按住“上”或“下”的同时按住shift，可以加速调节颜色。

也可以选中颜色值中间2位，“上”、“下”光标移动，调整颜色；

上、下光标调整颜色

快速调整不透明度：鼠标滚轮滚动 + 按住alt（option）键；

快速调整不透明度

4、快速选择使用同一颜色的元素；

框选所有元素，在右侧“已选的颜色”项下，选择某一颜色后，最右侧的靶icon，点击一下，系统就可以帮我们选中使用该颜色的所有元素。

快速选中使用同一颜色的元素

二、 颜色的复用及调用；

1、步骤：

（1）绘制一个图形；点击如下图：填充右侧的“样式”icon，在弹窗中，选择右上角的“+”新建样式；

新建样式

（2）创建新的颜色样式下，输入名字和描述（可写可不写）；新建样式完成！

（3）接下来，我们再绘制元素，想要使用之前的图层样式颜色；直接再点击“样式”，选择下边我们上一步加好的颜色即可；

2、修改颜色样式；

颜色样式有网格模式和列表模式；操作方法略有不同；

（1）网格模式下：

假如建好的颜色样式后续需要修改；鼠标右键单击，然后选择编辑样式；

编辑样式

在弹窗中，点击左下角属性下的色框，在弹出的色板上调色即可；这样整个颜色样式就修改了。

编辑样式重新调色

（2）列表模式下：

列表模式

假如建好的颜色样式后续需要修改；该颜色样式后，点击“编辑样式”图标；

编辑样式

在弹窗中，点击左下角属性下的色框，在弹出的色板上调色即可；这样整个颜色样式就修改了。

编辑样式重新调色

3、改变其中某一元素颜色：分离样式。

当某一元素不希望使用之前建好的颜色样式时，点击右侧：“分离样式”；然后就可以单独编辑这个元素的颜色。

分离样式

Figma颜色个人绘制部分的知识，大概就这些；