免费
调色板生成器
生成和谐的调色板。探索互补、类似、三元方案。导出为 CSS、Tailwind 或图像。
您的文件永远不会离开您的设备
剩余 10:00
#DB5799
rgb(219, 87, 153)
hsl(330°, 65%, 60%)
#29C24D
rgb(41, 194, 77)
hsl(134°, 65%, 46%)
#C46B4A
rgb(196, 107, 74)
hsl(16°, 51%, 53%)
#BF89DC
rgb(191, 137, 220)
hsl(279°, 54%, 70%)
#40F03D
rgb(64, 240, 61)
hsl(119°, 86%, 59%)
什么是调色板生成器？
StackPro 的免费调色板生成器可帮助设计师和开发人员在几秒钟内创建美丽、和谐的配色方案。从任何基色开始，探索互补色、类似色、三元色和单色和谐。锁定您喜欢的颜色，使用视觉选择器调整各个色调，检查对比度的可访问性，并以开发人员就绪的格式导出，例如 CSS 自定义属性、Tailwind 配置或 SCSS 变量。
如何使用调色板生成器
- 使用颜色选择器选择基色或输入十六进制值。
- 选择和声模式（互补、类似、三元等）。
- 通过单击任何样本来微调各个颜色。
- 锁定您喜欢的颜色，然后按“生成”以获得新的变化。
- 将最终调色板导出为 CSS、Tailwind、SCSS，或下载为 PNG。
特点
- 多种和声模式：互补、类比、三元、四元、单色
- 具有十六进制、RGB 和 HSL 输入的视觉颜色选择器
- 用于迭代调色板构建的颜色锁定
- WCAG 对比度检查器
- 导出为 CSS 自定义属性、Tailwind 或 SCSS
- 将调色板下载为 PNG 图像
- 调色板历史和最爱
- 100%客户端处理
常见问题解答
有哪些色彩和谐模式可用？▼
使用互补、类似、三元、四元、分裂互补和单色和谐生成调色板。您还可以通过选择单独的颜色来创建完全自定义的调色板。
我可以导出调色板进行开发吗？▼
是的！将调色板导出为 CSS 自定义属性、Tailwind CSS 配置、SCSS 变量或可下载的 PNG 图像。每种格式都可以粘贴到您的项目中。
如何找到易于使用的颜色组合？▼
该生成器包括一个对比度检查器，可评估调色板中任意两种颜色之间的 WCAG 2.0 对比度，帮助您确保文本的可读性和可访问性合规性。
我可以在生成新调色板时锁定颜色吗？▼
是的！锁定您喜欢的任何颜色，然后重新生成 - 只有解锁的颜色才会改变。这使您可以围绕品牌颜色迭代构建完美的调色板。