颜色转换器

🎨 Color Converter

📐 工作原理与说明
在 RGB、HEX、HSL、HSV、CMYK 等颜色模型之间互转。
  • RGB/HEX:三通道 0–255,HEX 写作 #RRGGBB,#RGB 为简写形式。
  • HSL 与 HSV:HSL 的 L 在 100% 时为纯白,HSV 的 V 在 100% 时为纯色,二者不可混用。
  • CMYK:印刷四色,色域小于屏幕 RGB,转换后会有可见色差。
  • 用途:设计稿取色、主题色推导、对比度校验(WCAG 无障碍)。
颜色转换
调色板
对比度
常用颜色
历史记录

Convert colors between HEX, RGB, HSL and more in your browser — with a live picker and copy buttons.

All format values and WCAG contrast results can be exported as CSV
选择基色生成调色板

互补色

类似色

三角色

分离互补色

单色调色板

Aa 示例文字
4.5:1
AA 级通过
✓
WCAG AA (4.5:1)
✗
WCAG AAA (7:1)
✓
大文本 AA (3:1)
✓
大文本 AAA (4.5:1)

Web 安全色

📖 颜色知识

RGB
红绿蓝
CMYK
印刷四色
HSL
色相饱和度明度
HEX
十六进制

📚 深度解析:颜色转换器

💡 常见使用场景

  • HEX/RGB/HSL 互转做配色。
  • 生成配色方案:把主色转成 HSL 后只调 L 得到浅色 hover 态与深色 active 态,保持色相一致,比反复试 HEX 高效。
转换
#3498db → rgb(52,152,219) → hsl(204,70%,41%)。

❓ 常见问题(FAQ)

HSL 选色优势?
用色相/饱和/亮度更直观调色。
为什么要考虑对比度?
颜色搭配不只是好看,还要可读。WCAG 要求正文文字与背景的对比度不低于 4.5:1,大字号不低于 3:1。转换时可按相对亮度公式算出对比度,避免浅色底配浅色字导致部分用户看不清。
⚠️ 使用说明与注意事项
📖关于「颜色转换器」 ▼

📝工具简介

颜色转换器是一款IT 开发领域的在线工具。专为开发者打造的在线工具,纯前端运行,代码不离开浏览器。