LOCAL-FIRST COLOR TOOLS

浏览器颜色与渲染实验室

转换颜色格式、检查文字对比度、生成 CSS 渐变，并在当前浏览器中预览实际渲染效果。所有计算均在本地完成，不上传数据。

无账号无追踪无外部依赖

颜色转换器

HEX、RGB、HSL 与透明度双向同步。

基础颜色

原生取色器 HEX / HEX8

透明度 100%

RGB

R G B

HSL

H S L

HEX

HEX8

RGB

RGBA

HSL

HSLA

变量

WCAG 对比度检查

使用未舍入数值判定，显示结果保留两位小数。

前景色

HEX

背景色

HEX

RENDERED SAMPLE

清晰的文字从可靠的对比度开始

这是 16px 普通正文，用于判断大多数界面内容的可读性。

这是 24px 大号文字。

示例文本链接

对比度

17.74 : 1

AA 普通文字
AA 大号文字
AAA 普通文字
AAA 大号文字

大号文字通常指至少 24px 的常规文字，或约 18.66px 的粗体文字。

CSS 渐变生成器

调整两端颜色与角度，复制可直接使用的声明。

起始颜色

HEX

结束颜色

HEX

角度 135°

UI 渲染预览

复用当前强调色、前景色与背景色测试常见组件。

卡片圆角 12px 阴影

实时样本

一个小而清晰的界面

观察正文、边框、透明度、焦点状态和阴影在当前浏览器中的实际呈现。

文本链接

25%50%75%100%

当前渐变

浏览器颜色能力

仅通过本地能力检测，不读取或上传完整 User-Agent。

8 位 HEX
现代 HSL 语法
OKLCH
Display P3
color-mix()
屏幕取色 API
安全剪贴板
设备像素比
系统配色偏好

sRGB

Display P3（支持时）

OKLCH（支持时）