· 等待输入
基准色
输出
配色方案
—点击色块复制它的颜色值；下方开关用于锁定色位，锁定后「变奏未锁定」不会改动它。
色值明细
—- 基准色 HEX
- —
- 基准色 RGB
- —
- 基准色 HSL
- —
- 色位数量
- —
- 色相跨度
- —
- 锁定色位
- —
说明
- 数据不出浏览器 · 零网络请求 · 可断网可用。
- 基准色接受 HEX（3/4/6/8 位，可省略 #）、rgb() / rgba()、hsl() / hsla()，通道数字或百分比都认。
- 方案按 HSL 色轮计算：互补取 +180°，类比取 ±30°，三分取 ±120°，分裂互补取 +150° / +210°，四方取 +90° / +180° / +270°；色相归一化到 0–360，饱和度与亮度 clamp 在 0–100。
- 明度色阶保留基准色的色相与饱和度，只改亮度：5 档为 ±18% / ±36%，7 档为 ±13% / ±26% / ±39%，超出 4%–96% 则收边。
- 锁定靠色块下方的开关：勾上的色位在「变奏未锁定」时保持原样，只对未锁定色位做色相 ±12°、饱和度 ±6% 的小幅抖动；明度色阶方案改为抖动亮度 ±5%。
- 点色块复制的是它的颜色值（按当前输出格式）；「下载 CSS」写出 :root 变量块，文件名 palette.css。
- 配色方案只是起点：同一组颜色在不同字号、材质与屏幕上的观感差别很大，落地前请放到真实版面里再看一眼。