调色板生成器
选择基准色和配色方案,以创建两色或三色调色板。使用互补色、类似色、三角色或分裂互补色,然后分别复制 HEX 代码,或将列表保存为文本。
功能介绍
使用四种配色方案创建调色板
选择互补色、类似色、三角色或分裂互补色,同时保留基准色的饱和度和亮度。
获取各颜色代码
查看色板和 HEX 代码,分别复制各代码,或按显示顺序将列表保存为 palette.txt。
将候选色用作下一个基准色
在候选颜色上选择“设为基准色”,然后生成新调色板。
使用方法
输入基准色
选择 HEX、RGB、HSL、HSV 或 CMYK 并输入数值,或使用拾色器。
选择配色方案
互补色会生成两种颜色。类似色、三角色和分裂互补色会生成三种。
创建调色板
选择“创建调色板”以查看色板和 HEX 代码。生成后更改配色方案,会根据已确认的基准色更新调色板。
获取代码
分别复制代码、复制全部,或保存为 TXT。更改基准色后请重新生成。
适用场景
探索强调色候选项
使用页面或设计中的基准色,比较不同色相关系。
在笔记中保留调色板代码
按显示顺序复制或保存 HEX 列表,以便在设计工具中使用。
配色方案和输出限制
四种色相关系
互补色使用与基准色相差 180 度的色相。类似色使用基准色两侧各 30 度的色相,三角色按 120 度间隔取色,分裂互补色使用偏移 150 度和 210 度的色相。类似色方案中的基准色显示在中间。
饱和度和亮度保持不变
调色板使用 HSL 改变色相,同时保留饱和度和亮度。结果会四舍五入为 8 位 RGB,并以 HEX 显示。无彩色可能产生重复 HEX 值;颜色数量和顺序会保留。
单独检查可读性
基于色相的调色板不保证文本对比度或可读性。请使用对比度检查器分别检查每组文本和背景颜色。
问答
为什么可能会出现多个相同颜色?
改变色相可能会使无彩色得到相同的 HEX 值。结果不会调整或去重;会保留配色方案中的颜色数量和顺序。
复制颜色会改变基准色吗?
复制不会更改基准色。选择“设为基准色”会将输入切换为 HEX,并清除之前的调色板。选择“创建调色板”以重新生成。
可以保存 CSS 变量或图像吗?
输出仅支持复制 HEX 代码和保存 palette.txt。不提供 CSS 变量或图像导出。
输入和输出
- 输入
- HEX、RGB、HSL、HSV 或 CMYK 格式的基准色,或选择的颜色。不支持 Alpha。
- 配色方案
- 互补色、类似色、三角色或分裂互补色。
- 输出
- 两到三个 HEX 代码。可复制或保存为 palette.txt,每行一个,按显示顺序排列。