CSS颜色名称查找器 — 从十六进制找最近命名颜色
输入十六进制颜色代码或使用颜色选择器，找到最接近的CSS4命名颜色。工具使用感知色彩距离将您的颜色与全部148种标准CSS命名颜色比较，并列出5个最近的匹配项。非常适合为代码和文档查找可读的颜色名称。
5个最近的CSS命名颜色：
工作原理
CSS命名颜色简史
CSS命名颜色经历了多个规范版本的演变。最初的CSS 1（1996年）仅定义了16种基本颜色：aqua、black、blue、fuchsia、gray、green、lime、maroon、navy、olive、purple、red、silver、teal、white和yellow。CSS 2增加了orange。CSS 3基于X11颜色列表将颜色扩展到147种，该列表本身可追溯至1980年代MIT维护的X Window系统颜色数据库。
CSS Color Level 4新增了一个名称：rebeccapurple（#663399）。这个颜色是为了纪念网页开发者Eric Meyer的女儿Rebecca Alissa Meyer——她于2014年因脑瘤去世，年仅6岁。她最喜欢的颜色是紫色，CSS工作组投票决定将她的名字纳入标准作为纪念。随着这一颜色的加入，CSS4规范精确定义了148种命名颜色，也是本工具搜索的全部颜色集合。
颜色距离的计算方式
单纯用欧氏距离比较RGB值并不符合人类感知——我们的眼睛对绿色差异比蓝色更敏感，而且在不同亮度范围内敏感度也会变化。本工具使用基于Thiadmer Riemersma的「色彩度量」的加权欧氏公式，该公式根据平均红色分量值调整R、G、B通道的权重，结果更接近人类对颜色差异的实际感知。
公式为：ΔE = √[(2 + R̄/256)·ΔR² + 4·ΔG² + (2 + (255-R̄)/256)·ΔB²]，其中R̄为两色平均红色分量。这是一种简化的感知度量——专业色彩科学采用分别考量明度、彩度和色相的CIELAB ΔE计算，但对于实际的颜色命名而言，这种简化度量对大多数颜色能给出直观的结果。
何时在CSS中使用命名颜色
命名颜色最适合快速原型开发、提升代码可读性和调试。写`color: tomato`比`color: #FF6347`更快、更容易记忆。在教育场景、数据可视化（语义化名称有助于传达含义）以及以有限命名颜色构成调色板的设计系统中同样十分有用。W3C建议在示例和教程中使用命名颜色以提升可读性。
在生产设计系统中，命名颜色很少作为主要调色板——通常首选自定义十六进制值、HSL或设计令牌名称。但是，了解与自定义值最接近的命名颜色，在文档编写、代码审查中的颜色注释以及口头交流某种颜色时非常实用。本工具通过找到最能描述任意十六进制颜色的CSS名称来填补这一空缺。
常见问题
›CSS命名颜色共有多少种？
CSS Color Level 4定义了148种命名颜色，包括CSS 1的最初16种基本颜色、CSS 2的orange、CSS 3的130种X11颜色，以及CSS 4新增的rebeccapurple（以纪念Rebecca Meyer）。需注意aqua与cyan是别名（同为#00FFFF），fuchsia与magenta也是如此（#FF00FF）。
›CSS颜色名称区分大小写吗？
不区分。根据规范，CSS颜色名称不区分大小写。'Red'、'RED'、'red'和'rEd'均指同一颜色。按照惯例，现代CSS中小写是最常见的写法。
›rebeccapurple是什么？
rebeccapurple（#663399）被添加到CSS Color Level 4，是为了纪念CSS专家Eric Meyer的女儿Rebecca Alissa Meyer，她于2014年因脑瘤去世，年仅6岁。她最喜欢的颜色是紫色，CSS工作组以她的名字命名了这个颜色以示悼念。这是CSS 4中唯一新增的颜色，也是自CSS 2以来第一个新增的命名颜色。
›为什么CSS命名颜色不能涵盖所有颜色？
148种命名颜色是基于历史X11颜色列表精心挑选的集合，涵盖了常见色相，但许多颜色没有命名——大多数蓝绿色调、粉橙色调和棕红色调都没有CSS名称。对于精确的设计工作，通常使用十六进制代码、rgb()或hsl()代替。
›CSS中gray和grey有什么区别？
两种拼写在CSS中均被接受。'gray'是规范的官方美式英语拼法，但'grey'（英式英语）同样是相同颜色（#808080）的有效同义词。类似地，'lightgray'/'lightgrey'、'darkgray'/'darkgrey'、'dimgray'/'dimgrey'、'slategray'/'slategrey'和'darkslategray'/'darkslategrey'都是有效的。
›最近颜色匹配的准确性如何？
匹配使用根据人眼敏感度加权RGB通道的感知距离公式。对于大多数日常颜色——饱和的红色、蓝色、绿色——最近的命名颜色在直觉上是正确的。对于非常暗淡、深暗或带棕色调的颜色，人类感知更具可变性，「最近」的命名颜色可能在主观上感觉不准确。显示的距离分数（Δ）越小表示匹配越近。
›能用这个工具为alt文字找到无障碍颜色名称吗？
可以。这个工具适合在alt文字、文档或设计注释中填写颜色名称。如果您需要向无法看到的读者描述UI元素的颜色，最近的CSS命名颜色提供了一个广为认知的名称。对于高度特定的色调，可以将CSS名称与修饰词结合使用（例如，#008080用「深青色」描述）。
›哪些十六进制颜色与CSS名称完全匹配？
148种标准CSS命名颜色中的任何一种都会产生完全匹配。常见示例：red = #FF0000、blue = #0000FF、white = #FFFFFF、black = #000000、coral = #FF7F50、tomato = #FF6347、skyblue = #87CEEB。输入任意十六进制值并寻找「完全匹配」提示即可确认。
相关工具
最后更新: