颜色选择器

HEX

#D97706

RGB

rgb(217, 119, 6)

HSL

hsl(32, 95%, 44%)

什么是颜色选择器?

颜色选择器提供直观的颜色选择和转换功能。支持三种主流格式:HEX(如 #FF5733)、RGB(如 rgb(255, 87, 51))、HSL(如 hsl(9, 100%, 60%))。可视化调色板可拖拽选择色相、饱和度和亮度。取色器工具可从屏幕任意位置取色(需浏览器支持)。自动生成互补色、类似色等配色方案。所有操作在浏览器本地完成。

使用场景5个场景
  • 网页设计和 UI 配色
  • CSS 颜色值查询
  • 品牌和 Logo 配色方案
  • 图像编辑取色
  • 数据可视化配色
如何使用?4
  1. 1在调色板上点击选择颜色
  2. 2或输入 HEX/RGB/HSL 值
  3. 3查看实时预览和格式转换
  4. 4复制颜色值或配色方案
功能特点8个特点
  • 免费使用
  • 无需注册
  • HEX/RGB/HSL 格式
  • 可视化调色板
  • 屏幕取色器
  • 自动配色方案
  • 一键复制
  • 响应式设计
常见问题6个问题
颜色选择器 是什么?

一个在线颜色选择和转换工具。输入:点击调色板或输入颜色值(HEX/RGB/HSL)。输出:颜色的多种格式表示和配色方案。用于设计、开发和配色,所有操作在浏览器本地完成。

HEX、RGB 和 HSL 有什么区别?

HEX 是十六进制颜色码(如 #FF5733),常用于 CSS。RGB 是红绿蓝三通道值(如 rgb(255, 87, 51)),范围 0-255。HSL 是色相、饱和度、亮度(如 hsl(9, 100%, 60%)),更直观易懂。

如何从屏幕取色?

点击"取色器"按钮,然后在屏幕任意位置点击即可获取该点颜色。此功能需要浏览器支持 EyeDropper API(Chrome/Edge 支持,Firefox/Safari 暂不支持)。

什么是互补色和类似色?

互补色是色轮上对面的颜色(如红色和绿色),对比强烈。类似色是色轮上相邻的颜色(如红、橙、黄),和谐统一。工具会自动生成这些配色方案。

支持透明色吗?

支持。HEX 格式可输入 8 位(如 #FF573380),RGB 格式可用 rgba(),HSL 格式可用 hsla(),最后一位表示透明度(0-1 或 00-FF)。

颜色值可以保存吗?

工具本身不保存颜色。建议复制颜色值到设计工具、CSS 文件或笔记中。浏览器可能记住最近使用的颜色(取决于浏览器设置)。