配色生成

配色生成器 - 一键生成配色方案，可锁定与导出

一键生成配色方案：按空格键换一组，锁定喜欢的颜色，检查文字对比度，并导出 CSS、SCSS、Tailwind 或 JSON。

5 种颜色

≈ DarkSlateGray

≈ DarkGreen

≈ LightCyan

≈ DarkCyan

≈ SkyBlue

每个颜色上的可读文字

:root {
  --color-1: #1F2917;
  --color-2: #006C41;
  --color-3: #D7F1ED;
  --color-4: #0095A8;
  --color-5: #94C3E2;
}

每组配色都在 OKLCH 色彩空间中生成，明度梯度均匀，颜色更协调。选择类似色、互补色或马卡龙等风格，锁定想保留的颜色，继续生成直到满意。网址会随配色实时更新，方便收藏和分享。

配色生成器如何挑选颜色？

先随机选取一个基础色相，再按类似色、互补色、三角色、单色或马卡龙规则在 OKLCH 中排布其他颜色，并把明度从深到浅分开，保证每组配色都有可用的对比度。

可以保留一个颜色、只换其他颜色吗？

可以。点击锁形按钮锁定颜色，它会保持在原位，并作为后续配色的色相基准。你也可以直接编辑任意颜色。

怎样分享配色？

页面网址始终包含当前颜色，例如 ?colors=1F2917-006C41-D7F1ED。复制链接即可分享或收藏。

生成的配色无障碍吗？

每个颜色都会显示最易读的文字颜色和对比度。还可以用色盲检查确认重要颜色对色觉障碍人群依然可区分。