3066个颜色，零数据库，零JSON文件，零API调用。一个前端团队用36个色相名、14个亮度词、6个饱和度档，在构建时凭空算出了整套色库。
这事听起来像程序员在炫技，但背后是个被忽视的设计痛点：手工调色板要么太少不够用，要么太多像垃圾堆。Material Design的256色被设计师吐槽"到处漏风"，而某些工具的5000色库又像把颜料桶打翻在地，找个颜色得翻五分钟。
ColorArchive的解法是把颜色当成三维空间来导航——色相是经度，亮度是海拔，饱和度是浓度。每个颜色都有人类能念出的名字：Crimson Silk Clear、Amber Dusk Muted、Sage Whisper Faint。
这套系统的核心约束是：整个数据集必须能从单一函数调用复现，零外部依赖。
36个"根名"锚定色相环
色相数组按10度间隔切分，从Crimson（0度）到Merlot（350度）。每个根名都经过挑选——不是"Red-1""Red-2"这种工业编号，而是Coral、Ember、Garnet这种能唤起具体联想的词。
36个根名 × 14个亮度档 × 6个饱和度档 = 3024个彩色。再加42个中性灰（3个灰根 × 14亮度，无饱和度后缀），凑齐3066。
亮度层的命名尤其有意思。从Veil（98%亮度，近乎白）到Ink（14%亮度，近乎黑），中间插着Whisper、Mist、Pearl、Bloom、Silk、Tone、Radiant、Core、Velvet、Dusk、Shadow、Nocturne。这些词不是随便抓的——Bloom（76%）比Silk（68%）亮，但比Pearl（84%）暗，念出来就能感知层级。
饱和度六档从Faint（10%）到Pure（92%），命名逻辑同样直白：Muted比Soft更灰，Clear比Vivid更收敛。
一个flatMap调用造出全库
代码极简。三层嵌套循环展开成flatMap，每次迭代生成一个完整颜色对象：
名字是字符串拼接：根名 + 亮度后缀。ID用kebab-case：amber-pearl-muted。RGB从HSL实时算出，hex、rgb字符串、hsl字符串一并输出。还附赠色相、饱和度、亮度数值，以及自动归类的色族（family）。
构建时跑一遍，产物是静态JSON。但源文件里没有任何硬编码的色值——只有那三个小数组和转换函数。
这意味着什么？版本控制里不会出现"谁改了#FF5733"这种扯皮。想加新色相？往hueCatalog塞一行。想调整亮度曲线？改lightBands里的数字。整个色库的行为是可预测、可审计、可回滚的。
对比手工维护的色库，这相当于用生成式对抗网络替代了画师手绘——不是否定审美，是把审美编码成规则。
命名即导航
ColorArchive最被低估的设计是名字系统。传统色库用#1A2B3C或rgb(26,43,60)当标识，人类大脑根本记不住。而"Amber Dusk Muted"自带空间感：橙黄家族、偏暗、偏灰。
设计师找颜色时，脑子里先有色相意向（"要个暖色"），再定亮度（"但别太跳"），最后调饱和度（"低调点"）。三层命名正好对应这个决策路径。
团队透露，根名选择花了大量时间。Crimson和Ruby都偏红，但Crimson带蓝调、Ruby偏玫红，10度差距要用词义区分。Ember（20度）比Coral（30度）更橙，Garnet（340度）比Merlot（350度）更紫——这些微妙差别靠命名传递，而非让用户在色轮上瞎摸。
亮度词的间距也不均匀。Veil到Whisper只降4%，Whisper到Mist也是4%，但Tone到Radiant降6%，Core到Velvet降6%。这是有意为之：人眼对中间调的敏感度更高，所以Silk-Tone-Radiant-Core这段加密采样，暗部亮部则相对稀疏。
零依赖的代价与收益
放弃数据库存储，换来的是极致的可移植性。ColorArchive可以跑在静态站点生成器里，可以塞进CI流水线，可以离线使用，可以fork后魔改。没有服务宕机风险，没有API限额，没有供应商锁定。
代价是构建时间。3066次颜色转换+字符串操作，在现代硬件上忽略不计，但在极端性能场景（比如每次保存都重建）可能需要缓存策略。团队目前的解法是构建时生成一次，产物提交到CDN。
另一个隐性成本是命名维护。36个根名、14个亮度词、6个饱和度档，总共56个词汇需要持续打磨。如果某天发现"Radiant"和"Core"的区分度不够，改名会影响所有下游引用。这是规则系统的通病：灵活性换一致性，一致性换可预测性。
但相比手工维护3066条记录的 nightmare，这仍是更健康的架构。想象Material Design想新增一个色相——需要设计师提案、评审、生成全套变体、更新文档。ColorArchive改一行代码， rebuild，完事。
这套方法论正在溢出颜色领域。字体字重、间距系统、阴影层级——任何"有规律的离散集合"都可以尝试生成式定义。Tailwind CSS的spacing scale、Open Props的设计令牌，都是同类思路。
ColorArchive的独特之处在于把生成逻辑暴露得如此彻底。不是"我们有一套设计系统"，而是"我们的设计系统就是这段代码，你可以读、可以改、可以fork"。
项目开源后，最意外的反馈来自无障碍领域。一位屏幕阅读器用户留言，说传统色库的"Light Blue 3"对盲人毫无意义，但"Sky Mist Clear"能让他建立心理模型——色相（天空）、亮度（薄雾）、饱和度（清透）。命名即语义，语义即可访问性。
热门跟贴