1. 先确认精确色值
先用精确 HEX、RGB 或官方颜色名定位具体条目，确认页面对应正确后，再进入转换、分析或比较相近颜色。
检索命名色、系统 Token 与精确 HEX 色值
颜色百科 | 798个真实来源颜色
按精确 HEX、RGB、颜色名或系统 Token 检索 CSS 命名色、Tailwind、Material、Ant Design 与 Flat UI 的真实颜色条目。
精确名称与 HEX 对应系统 Token 与来源色库可继续进入转换与对比度判断
搜索建议
如果您已经拿到 HEX 或 RGB，先搜数值，优先确认精确匹配。
如果您在按语义或来源检索，可直接搜索颜色名、色阶编号或系统名称。
结合色相和来源筛选，会比只搜关键词更快收窄结果。
热门搜索:
站内说明用于设计与研发参考，不替代官方品牌规范、平台说明或最终生产验证。
如何使用这个颜色百科
2. 再确认来源体系
确认该颜色来自 CSS 标准、设计系统色板还是开源色库，确保命名语境和使用语境一致。
3. 判断工作场景
结合色相家族和筛选条件，判断它更适合界面主色、活动视觉、内容编排还是品牌辅助色。
4. 继续进入后续工具
当参考色确认后，优先进入转换器或分析器；只有当颜色角色已经明确时，再按需进入配色或渐变工具。
按色相探索
为什么这些结果值得看
这些结果值得看，不只是因为它们有颜色值，更因为每个条目都保留了命名体系、来源色库、色相归属与后续工作语境，方便您在设计稿、规范文档和代码中继续说明。
这里的目标不是展示一堆随机色块，而是帮助您以可解释、可追溯、可继续交付的方式识别颜色。
CSS Royal Blue
#4169E1Royal Blue
Material 蓝色 500
#2196F3Material Blue 500
Tailwind 蓝色 500
#3B82F6Tailwind Blue 500
Ant Design 蓝色 6
#1677FFAnt Design Blue 6
Flat UI 绿松石色
#1ABC9CFlat UI Turquoise
CSS Coral
#FF7F50Coral
探索不止，灵感常在。
来源聚焦
Tailwind CSS 色板#4F46E5
Tailwind 靛蓝 600Tailwind Indigo 600
Tailwind Indigo 600 就是 `#4F46E5` 对应的官方 Token，这类查询通常先要精确答案，再决定是否进入对比度分析或配色扩展。
为什么这个颜色值得单独看
这个条目值得单独看，不只是因为常见，而是因为搜 `#4F46E5`、`4F46E5 color` 或 `indigo-600` 的用户，通常不是先找灵感，而是要先确认准确 Token、关键参数和下一步操作入口。
Tailwind 靛蓝 600 收录自公开发布的 Tailwind CSS 色板，保留为可检索的参考色值，可直接用于产品与界面参考工作。
配色建议来源色库
不同来源色库解决的是不同工作问题。CSS 命名色适合标准沟通，系统色板适合产品界面落地，开源色板更适合作为可复用参考和活动视觉起点。
从参考检索继续进入工作流
色彩常见问题 (FAQ)
为什么这个库不追求收录数量最多？
因为数量本身并不能提高工作可用性。这个百科优先保留来自公开标准、发布包和设计系统的可核验颜色，而不是用程序继续扩充近似值或虚拟色阶。
为什么不同来源里会出现相同的 HEX？
不同体系经常会用不同名称复用同一数值颜色。这里保留这些独立条目，是为了让您能按团队习惯、设计稿命名或代码中的来源体系继续检索。
我应该先看颜色名还是先看 HEX？
如果您手里已经有 HEX 或 RGB，建议先从数值入手，先确认精确匹配。若您更关心语义、系统位置或品牌语言，则应先从颜色名、色阶编号或来源体系开始。
什么时候该从百科跳到转换器或分析器？
百科的职责是帮助您识别和核验颜色。需要交付不同格式时，进入转换器；需要判断亮度、饱和度或配色关系时，进入分析器。配色扩展只在颜色角色已经明确时再考虑。
站内说明和官方品牌规范是什么关系？
站内说明用于工作参考，不替代官方品牌手册、平台规范或当前设计系统标准。一旦品牌方或平台提供了最新官方说明，应以官方文档为最终依据。