Token导航 LogoToken导航

颜色选择 · HEX/RGB/HSL · 本地处理

颜色选 择器

在浏览器本地选择颜色并查看 HEX、RGB、HSL 数值,输入不会上传服务器。

色值同步输出

选择颜色后同步显示 HEX、RGB、HSL,便于设计和前端直接使用。

一键复制

支持分别复制 HEX、RGB、HSL,减少手动转换和录入错误。

本地处理

颜色选择和数值转换都在浏览器本地完成,不上传服务器。

颜色选择 · 浏览器本地处理

颜色选择器

选择颜色后查看 HEX、RGB、HSL 数值,适合设计对色和前端样式配置。输入不会上传服务器。

HEX

#2563EB

RGB

rgb(37, 99, 235)

HSL

hsl(221, 83%, 53%)

处理方式

本地

颜色选择和数值转换都在浏览器本地完成,不上传服务器。

工具使用说明

怎么用 颜色选择器

1

选择颜色

使用颜色控件选择目标颜色,页面会实时更新色值。

2

查看多格式结果

同时查看 HEX、RGB、HSL 三种常用格式。

3

复制使用

按需要复制到 CSS、设计标注或组件配置中。

功能说明

这个工具解决什么问题

颜色选择器 为什么适合做成本地工具

颜色选择和格式转换只依赖浏览器本地计算,不需要服务端参与。

在设计对色、CSS 编写和组件配置中,快速拿到多格式色值能减少重复操作。

结果怎么使用

HEX 适合大多数 CSS 场景,RGB 适合透明度组合,HSL 适合按色相和明度微调。

复制后建议放回真实页面或设计稿中查看最终视觉效果。

常见问题

关于 颜色选择器,用户常问这些

颜色数据会上传服务器吗?

不会。颜色选择和数值转换都在浏览器本地完成。

支持哪些格式?

当前同步输出 HEX、RGB 和 HSL。

可以直接复制吗?

可以,三个格式都提供复制按钮。

能从图片里取色吗?

当前是颜色选择器;图片取色可使用已上线的图片坐标拾取工具。