转换
hex: #f20c00
hsl: 3, 100, 47
rgb: 242, 12, 0
xyz: 37, 19, 2
cmyk: 0, 95, 100, 5
lch: 51, 100, 40
lab: 51, 76, 65
hwb: 3, 0, 5
变化

本节的目的是以10%的增量准确生成您选择的颜色的色调(添加纯白)和阴影(添加纯黑)。

色调(深色)
色调(浅色)
颜色组合

每个色彩搭配都有其独特的情绪。利用色彩搭配方案来进行头脑风暴,找到相互搭配得很好的颜色组合。

互补色

互补色方案指的是在色轮上选择一个颜色及其对立的颜色,两者的色相相差 180 度。这种搭配具有高对比度的特点。

分裂互补色方案

分裂互补色方案指的是选择一种颜色以及其互补色相邻的两种颜色,这两种颜色的色相与主色的互补色相差 +/-30 度。这种方案的效果与直接互补色类似,但更加灵活多变。

三色方案

三色方案指的是在色轮上均匀分布的三种颜色,彼此之间相差 120 度的色相。最好让其中一种颜色主导,其他两种颜色用作点缀或强调。

类似色

相同亮度和饱和度的三种颜色,其色相在色轮上相邻,相差30度。过渡自然平滑。

单色调

相同色相的三种颜色,亮度值上下偏移 +/-50%。细腻而精致。

四色方案

两组互补色,色相相差 60 度。

对比度检测

计算两种颜色之间的WCAG对比度比率。建议最低对比度达到 4.5,以确保文字在背景颜色上可读性良好。

1

无对比度

生活就像一盒巧克力
你永远不知道下一块会是什么味道

更多