配色方案生成器
免费配色方案生成器:生成和谐的调色板(类似色、互补色、三角配色等),锁定喜欢的颜色,并导出为 HEX 或 CSS。
按空格键或“生成”获取新颜色。锁定想保留的颜色,点击色值即可复制。
它做什么
此生成器可为网站、应用、演示文稿和设计作品创建配色方案。选择一种配色方式,即可从基础色出发搭配出协调的颜色;也可以按空格键生成随机配色,并锁定喜欢的颜色,只让其余颜色变化。颜色在 OKLCH 色彩空间中计算,即使色相改变,感知亮度也保持不变,因此配色看起来更均衡。可将颜色复制为 HEX、CSS 变量或 JSON,或通过链接分享调色板。
使用方法
- 选择配色方式和基础色,或保持随机。
- 按空格键或“生成”,直到满意为止;锁定想保留的颜色。
- 点击色值即可复制,或将整个调色板复制为 HEX、CSS 或 JSON。
常见问题
这些配色方式是什么意思?
它们是色轮上的经典组合。类似色使用相邻的色相,效果柔和;互补色使用相对的色相,对比强烈;三角配色和四角配色将三个或四个色相均匀分布;分裂互补色让互补色组合更柔和;单色配色则使用同一色相的多种深浅。
为什么用 OKLCH 而不是 HSL?
在 HSL 中,亮度值相同的黄色和蓝色看起来明暗差异很大。OKLCH 是根据人眼感知设计的,因此旋转色相时颜色的亮度保持一致。正因如此,这一色彩空间被加入了 CSS。
可以检查颜色是否易于阅读吗?
可以:使用颜色对比度检测工具,查看某种颜色的文字在另一种颜色的背景上是否符合 WCAG 无障碍标准。