色彩命名工具核心JS实现

色彩命名工具的功能很直观：输入一个颜色值，就能得到颜色名称、相近色列表，以及常用色彩格式与配色方案。它接受 HEX、RGB、HSL 或中文/英文色名作为输入，输出统一可靠。

在线工具网址：https://see-tool.com/color-naming
工具截图：

下面按“实际运行流程”把核心 JavaScript 逻辑拆开讲，尽量用更直白的方式说明每一步做什么。

工具允许多种输入形式，但最终都会被规范成同一结构：RGBA。

只要解析失败，就会提示“无效颜色”，不会进入后续流程。

所有输入数值都会被“夹在合理范围内”，避免出现异常结果：

这个小步骤能防止超出范围的输入把后续计算带偏。

界面需要多种输出：HEX、RGB、HSL、HSB、CMYK。为了让这些格式始终保持一致，工具把 RGB 作为中间基准，再进行格式转换。这样做的好处是“一个输入值，所有格式都来自同一个计算源”。

命名并不是简单“看最接近的 HEX”，而是分几层打分：

得分最低的颜色就是主命名。这个得分会被换算成 0-100 的置信度，用来提示“匹配有多接近”。

除了主命名，工具还会计算其它颜色与目标色的距离，然后从近到远排序，取前几名作为“相似色推荐”。这样用户能看到更丰富的命名选择。

配色方案全部基于 HSL 的色相变化，因为 HSL 更符合“以色相为核心做配色”的直觉：

最终统一输出为 HEX 数组，方便展示与复制。

核心动作只有三类，但覆盖了所有交互：

这样工具在逻辑上形成闭环：输入 -> 规范化 -> 命名/格式/配色 -> 输出。