颜色选择器 使用指南
无论是写 CSS 还是做设计稿,准确的颜色值都至关重要。ToolBox 颜色选择器在本地帮你取色、微调,并实时互转 HEX / RGB / HSL 多种格式。
核心功能
- 可视化调色板,拖动即时取色
- HEX / RGB / HSL 三种格式实时互转
- 显示对比文字色(黑/白)建议
- 支持复制任意格式
- 可输入颜色值反向定位
适用场景
- 前端开发写 CSS 颜色值
- 根据品牌色推导相近色
- 对比前景/背景可读性
- 从图片吸色后转成代码可用值
使用步骤
- 在调色板拖动选择目标颜色
- 查看同步生成的 HEX/RGB/HSL
- 复制需要的格式到代码
- 输入某个已知色值可反向定位到面板
- 用对比色提示确认文字可读性
实用技巧
- 同一颜色在不同屏幕有偏差,重要品牌色以代码值为准
- 保证可访问性:正文与背景对比度建议 ≥4.5:1
- HSL 更适合做明暗/饱和度微调
- 保存调色板时注意命名一致
常见问题
- HEX 和 RGB 哪个更好?
- 本质等价,HEX 更紧凑、RGB 更直观,按需选择。
- 怎么保证文字可读?
- 用工具提供的对比色建议,确保前景背景对比度足够。