生成 CSS 渐变
选两个颜色和一个角度,通栏看效果,然后把这条 CSS 声明直接复制进样式表。
background: linear-gradient(135deg, #2f6feb, #a855f7);如何使用
- 1选起始色和结束色。
- 2设角度——0° 朝上,从那里顺时针转。
- 3把生成的 CSS 声明直接复制进样式表。
常见问题
- 角度是朝哪个方向的?
- 按 CSS 的约定:0deg 朝上,90deg 朝右,之后顺时针。这和数学上的约定差了 90 度——渐变方向转错了,通常就是因为这个。
- 为什么渐变中间那一段发灰发脏?
- 因为它从色轮中心穿了过去。蓝到黄要经过灰,蓝到紫就不会。让两个色相彼此离得近一些,或者挑一个你真正想要的中间色,到那里停住。
- 能用三种以上的颜色吗?
- 这个页面不行,它生成的是两个色标的声明,也是绝大多数人需要的那一种。CSS 语法本身支持任意多个色标,所以这里的输出是个起点,你可以手工往上加。