跳到主要内容
Color Codes

选择颜色

颜色选择器

可视化选择颜色,或输入十六进制、RGB 和 HSL 数值,查看对应 OKLCH、明暗色阶、色调和和谐配色,用于 CSS、UI 组件与品牌色板。

选择颜色

颜色值

RGB
HSL

明暗色阶

点击任一色阶即可将其设为基础色。

和谐配色

互补色
类似色
三角色
分裂互补色

下一步

你可以在这里做什么

01

HEX、RGB、HSL 与 OKLCH

在一个工具里比较常用 CSS 颜色格式,并复制设计工具或代码库需要的色值。

02

生成明暗色和色调

用一个基础色生成浅色、深色和中间色,适合 hover 状态、边框、背景和设计 token。

03

建立颜色系统

选定基础色后,可继续检查对比度、转换格式,或打开色轮生成完整配色方案。