Tools.Fun

有趣免费工具

颜色选择器

即时选择、转换和分析颜色。支持 HEX、RGB、HSL 格式和 WCAG 对比度检查。设计师专用的免费在线颜色工具。

💡 需要详细说明？ 查看完整文档 →

colorPicker.clickOrEnter

colorPicker.formatValues

HEX
HEX8
RGB
HSL
HSV

colorPicker.contrastCheck

colorPicker.withWhite (colorPicker.ratio: 4.47)
Aa
colorPicker.fail
colorPicker.withBlack (colorPicker.ratio: 4.70)
Aa
AA

colorPicker.colorVariants

#c1c2f9
#9294f5
#6366f1
#3438ed
#1418da

colorPicker.colorHarmony

#6366f1
#f1ee63
#6366f1
#639ff1
#6382f1
#6366f1
#7c63f1
#9963f1
#6366f1
#f163d8
#9ff163
#6366f1
#f16366
#66f163

📚 想要更深入了解？

查看完整的使用指南、功能说明和实际案例

📖 阅读完整文档

📖 关于此工具

快速了解工具的功能和使用方法

什么是颜色选择器和调色板生成器？

颜色是视觉设计的基础，传达情感、建立品牌标识并创造用户体验。我们的颜色选择器和调色板生成器提供了选择、转换和组合Web设计、平面设计和数字艺术项目颜色所需的一切。

从交互式光谱中选择颜色，在RGB、HSL、HSV和HEX格式之间转换，并使用自动和谐检测生成漂亮的调色板。无论您是设计网站、创建品牌资产还是从事数字艺术，这个工具都能帮助您找到完美的颜色和组合。

该工具完全在您的浏览器中运行，无需服务器端处理。所有颜色转换和调色板生成都即时发生，在您探索不同颜色选项时为您提供即时反馈。一键单击即可以任何格式复制颜色代码。

如何使用

  1. 1 点击颜色光谱或使用颜色滑块选择您的基本颜色
  2. 2 同时查看所有格式的颜色：RGB、HSL、HSV和HEX
  3. 3 点击"生成调色板"以创建互补颜色组合
  4. 4 选择和谐类型：互补、类似、三色或分离互补
  5. 5 通过点击来调整调色板中的单个颜色
  6. 6 单击旁边的复制按钮将任何颜色代码复制到剪贴板
  7. 7 将调色板导出为CSS变量或JSON以在您的项目中使用

常见使用场景

  • ✓ Web设计：为网站和Web应用程序选择配色方案
  • ✓ 品牌标识设计：为徽标和品牌创建有凝聚力的调色板
  • ✓ 平面设计：为插图、海报和营销材料选择颜色

查看完整文档了解更多使用场景 →

↑ 返回工具