取色器：即时获取HEX、RGB及HSL代码

颜色格式说明

不同的工具和平台使用不同的颜色格式。我们的取色器同时显示三种格式：

HEX

格式： #FF5733。由六个十六进制数字表示的红、绿、蓝通道。这是网页开发（CSS、HTML）和设计工具中最常见的格式。每对数字的范围从00（无色）到FF（最大值）

RGB

格式： rgb(255, 87, 51)。三个十进制数值（0–255）分别代表红、绿、蓝。用于CSS、JavaScript以及大多数编程语言。易于阅读和理解—数值越大，该颜色成分越多。

HSL

格式： hsl(11, 100%, 60%)。色相（0–360°）、饱和度（0–100%）和明度（0–100%）。对人类来说最直观的颜色模型—通过调整色相来改变颜色，通过饱和度调节鲜艳程度，通过明度调节亮度。

小贴士：需要生成颜色变体时，可以使用 HSL，保持色相并调整饱和度、明度，得到相关的浅色或深色，用于构建配色系统。

功能

• 视觉取色器 —在颜色谱和亮度/饱和度面板上任意点击即可选择颜色。
• 手动输入 —直接输入HEX、RGB或HSL值。其他格式会自动更新。
• 吸管取色——浏览器支持时，可从屏幕上的图片选取颜色。
• 颜色板 —保存你喜欢的颜色，并为你的项目构建颜色板。
• 一键复制 —可立即将任意格式复制到剪贴板。

常见使用场景

• 网页开发 —获取用于CSS样式的精确HEX或RGB代码。
• 图形设计 —在不同工具（如Figma、Canva、Photoshop）中保持品牌颜色一致。
• 社交媒体 —从品牌标志或图片中找到精确颜色，确保内容发布的一致性。
• 演示文稿 —将幻灯片颜色与公司品牌保持一致。
• 室内设计参考——把数字颜色记录为沟通起点。HEX、RGB、HSL 不是油漆配方；屏幕、光照和材料都会影响观感，选漆前应对照实物色样。
• 数据可视化——先挑选候选配色，再单独检查对比度及色觉可访问性。仅仅选出颜色，不能证明图表满足无障碍要求。

构建颜色板

一个良好的颜色板通常包含3–5种颜色：

• 主色 —你主要的品牌或强调色。
• 次级色 — 互补或对比色。
• 中性色 — 背景和文字（灰色、白色、黑色）。
• 成功/错误色 — 成功用绿色，错误用红色（功能色）。

从主色开始，使用HSL生成变体：背景使用更亮的色调，悬停状态使用更深的色调，禁用元素使用去饱和版本。

隐私

颜色转换与图片采样在浏览器本地进行，不上传图片处理。保存的色板颜色会保留在 localStorage 中，右键点击已保存颜色可从色板移除。普通访问统计与页面资源加载另行处理。