有时候做的网站觉得土到掉渣
未必是排版的问题
也可能是配色的锅
（也可能两个都有问题）
为啥上面两张剧照差距就这么大呢？
其实就是一个色彩饱和度的问题
要知道学过色彩绘画的人
都不会直接用颜料罐里的颜色
而是经过调色后再使用
因为纯度太高的颜色轻浮、不稳定
加入其他颜色调色后纯度降低
画面就会表现出沉稳厚重的高级灰色调
配色这个问题
如果要从基础理论讲
肯定没有几个人有耐心看
而我也没有耐心写
所以我只能给走捷径了
自己不会配不要紧
那就用已经被肯定过的配色啊
例如：专业的配色网站
配色网站中的每个颜色
都是经过设计师筛选出来的
确保颜色都是稳定耐看的
今天只抓一个渐变色来学习
接下来认真看啦
（不想学可以放进收藏箱吃灰）
我们可以开始了
结尾有彩蛋
渐变配色篇
渐变色经常被用来作为背景色使用
但是渐变色要想好看
其实也并不好把握
想过渡得自然和谐
前端和末端的色一定要匹配得好
像这些渐变色
已经OUT了
↓↓↓
下面三个网站
让大家轻易调出好看的渐变色
01 coolhue
https://webkul.github.io/coolhue/
这个网站给出了60种渐变配色
有同色系的也有对比色
点击色彩框的右下角<>
马上可以复制色彩编号
↓复制出来是这样的↓
background-image: linear-gradient
( 135deg, #F0FF00 10%, #58CFFB 100%);
我们只需要关注橙色部分就可以了
#XXXXXX是前后的颜色值
10%和100%是颜色位置（可以不管）
deg是角度 （可以不管）
把它运用到网站中就OK了
看看实操示例
确认后立马就可以看到效果啦！
（大佬：确定这叫好看吗？我：还不是为了突出效果）
02 uigradients
https://uigradients.com/#SummerDog
这个网站版面很大气
有两种使用方法
第一种 随缘
一直按>翻页
随机挑选出现的渐变色
第二种 点击左上角
精确选择你喜欢的色系
03 itmeo
https://webgradients.com/
180个线性渐变的免费集合
轻松复制CSS3跨浏览器代码
以上配色网站用法都一样
查看配色颜色值
到网站设计中设置对应颜色值
彩蛋篇
此处彩蛋介绍一个
好看又感觉没啥用的色彩网站
中国色
http://zhongguose.com/
这个网站是模仿的一个日本色网站
一度在微博非常火爆
一是因为网站颜值高
二是因为它每个颜色都有名字
而且极富中国文化底蕴
虽然对配色来说它作用不大
秉着不浪费的目的
我觉得给文案师用来吹水还是不错的
比起：
“品牌包装特地选用了淡紫色作为主色”
“搭配淡黄色别有韵味”
显然这么说更厉害：
“品牌包装特地选用了青莲色作为主色”
“搭配素馨黄别有韵味”
最后再唠叨一句
在使用配色前，请务必记住这个准则
↓↓↓
【建站渐变配色不要超过2个】噢
优网科技秉承"专业团队、品质服务" 的经营理念，诚信务实的服务了近万家客户，成为众多世界500强、集团和上市公司的长期合作伙伴！
优网科技成立于2001年，擅长网站建设、网站与各类业务系统深度整合，致力于提供完善的企业互联网解决方案。优网科技提供PC端网站建设（品牌展示型、官方门户型、营销商务型、电子商务型、信息门户型、微信小程序定制开发、移动端应用（手机站、APP开发）、微信定制开发（微信官网、微信商城、企业微信）等一系列互联网应用服务。
公安局备案号：
专属顾问
