调色板生成器
利用色彩理论从任意基础颜色生成和谐的调色板。选择互补色、类似色、三角色、分裂互补色或四边色方案。即时将所有颜色复制为CSS变量。
广告
基础颜色
颜色和谐
#000000
rgb(0, 0, 0)
#000000
rgb(0, 0, 0)
#000000
rgb(0, 0, 0)
#000000
rgb(0, 0, 0)
#000000
rgb(0, 0, 0)
广告
常见问题
什么是颜色和谐？
颜色和谐是指根据颜色在色轮上的位置排列出视觉上令人愉悦的颜色组合。和谐调色板遵循色相之间的数学关系——如对立色（互补色）或等间距色（三角色）——在设计中创造平衡感和凝聚力。
什么时候应该使用互补色而不是类似色？
互补色（色轮上的对立色）产生高对比度和视觉张力——非常适合行动号召按钮、高亮元素，或任何需要突出显示的地方。类似色（色轮上相邻的颜色）和谐且低对比度，非常适合背景、中性UI元素或创造平静统一的氛围。
如何在CSS中使用这些颜色？
点击"复制所有颜色为CSS变量"获取包含--color-1到--color-N变量的:root块。将其粘贴到样式表中，然后使用var(--color-1)等引用它们。对于单个颜色，点击每个色块上的复制按钮直接复制十六进制值。