第三章:颜色
颜色要克制,尽可能用枯燥却实用的颜色,例如,使用小字体低饱和度的颜色,让信息看起来更舒适。
而且本书中的思维,并不是要研究颜色理论,以及不同的颜色带来的复杂的情绪变化,而是提供几个不那么差的选项,以供选择参考。
对于一个复杂的系统,你并没有那么多的选择
多用蓝色,210 次选用橙黄色,绿蓝色 保留绿色,给人安全 保留黄色,作为抓取注意力的颜色 保留红色,进行危险动作提示,或是强烈的冲击 保留金色,给人以高级感
蓝色,墨绿方向(青色hue),紫色方向
克制自己使用灰色的shades开始,或者克制自己只用蓝色(H值在180 - 240),而调整SL或者SV值
3.1 常见颜色
3.1.1 白色背景
3.1.1.1 黑灰色
最为保险和实用的情景,
3.1.1.2 红色
3.1.1.3 蓝色
3.1.1.4 橙色(红色的延伸)
3.1.1.5 绿色
3.1.1.4 金色
3.1.1.6 紫色(红色 + 蓝色)
3.1.1.4 褐色(黄色的延伸)
3.1.2 黑色背景
3.1.2.1 白色
3.1.2.2 金色
3.1.2.2 绿色
3.1.3 黄色背景
3.1.3.4 黑色
经典常见的配色搭配,黄色明亮,黑色清晰,就是在白色的基础上,增加了一份乐趣
3.2 配色
3.2.1 背景和文字
黄色和褐色
3.2.1 背景色和边框色
3.3
Gray
灰色(#xx)是最实用的颜色,甚至应该尝试着都用灰色设计,然后必要的地方增添其他的颜色,再接着根据主色调分配颜色
用灰色作背景,
- table的header
- card的header
- form/modal的footer
- page的footer
- secondary region bg color
Colors
- 红金:Red BG and Yellow (Gold)
- 绿金:Dark Green BG ang Gold
- 黑金:Black BG and Gold
- 黄褐:Yellow BG and Brown
- 黄黑:Yellow BG and Black
- 黑绿:
- 白红
- 白蓝
- 白褐
- 白绿
- 白X灰
水墨灰
和纯脆的灰色(#xx)相比,加入一定青蓝色的灰色,给人以高级的质感。