最可靠的是批量替换W3C推荐的140个基础命名颜色（如red、darkslategray），优先处理常见16色，避开rebeccapurple等低兼容性名称及带空格/连字符变体；正则须锚定属性值位置，排除字符串、URL、注释、自定义属性和媒体查询中的伪颜色。
直接用正则批量替换最可靠，但必须区分上下文，否则会误伤注释、URL、自定义属性等。
哪些 CSS 颜色名能被安全替换？
CSS 标准定义了 147 个命名颜色（含 transparent），但浏览器实际支持略有差异。真正建议批量处理的只有 W3C 推荐的 140 个基础名（如 red、darkslategray），避开 rebeccapurple 这类易拼错或低兼容性名称。
- 优先处理常见 16 色：
black、white、red、green、blue、yellow、cyan、magenta、gray、lightgray、darkgray、silver、maroon、purple、olive、navy - 跳过带空格或连字符变体（如
light gray或Dark-Slate-Gray），它们不是合法颜色值，大概率是写错了 - 不处理
currentColor—— 它是动态关键字，不能转成十六进制
正则替换怎么写才不炸掉 CSS？
核心是锚定在属性值位置：只匹配冒号后、分号前、且不在引号/括号/注释内的独立单词。
推荐 VS Code 或 Sublime Text 中使用的正则模式：
立即学习“前端免费学习笔记（深入）”；
/(:s*)(?<!\)("(?:[^"\\]|\\.)*"|'(?:[^'\\]|\\.)*'|url(.*?)|/*[sS]*?*/)|(:s*)((?:aliceblue|antiquewhite|aqua|aquamarine|azure|beige|bisque|black|blanchedalmond|blue|blueviolet|brown|burlywood|cadetblue|chartreuse|chocolate|coral|cornflowerblue|cornsilk|crimson|cyan|darkblue|darkcyan|darkgoldenrod|darkgray|darkgreen|darkkhaki|darkmagenta|darkolivegreen|darkorange|darkorchid|darkred|darksalmon|darkseagreen|darkslateblue|darkslategray|darkturquoise|darkviolet|deeppink|deepskyblue|dimgray|dodgerblue|firebrick|floralwhite|forestgreen|fuchsia|gainsboro|ghostwhite|gold|goldenrod|gray|green|greenyellow|honeydew|hotpink|indianred|indigo|ivory|khaki|lavender|lavenderblush|lawngreen|lemonchiffon|lightblue|lightcoral|lightcyan|lightgoldenrodyellow|lightgray|lightgreen|lightpink|lightsalmon|lightseagreen|lightskyblue|lightslategray|lightsteelblue|lightyellow|lime|limegreen|linen|magenta|maroon|mediumaquamarine|mediumblue|mediumorchid|mediumpurple|mediumseagreen|mediumslateblue|mediumspringgreen|mediumturquoise|mediumvioletred|midnightblue|mintcream|mistyrose|moccasin|navajowhite|navy|oldlace|olive|olivedrab|orange|orangered|orchid|palegoldenrod|palegreen|paleturquoise|palevioletred|papayawhip|peachpuff|peru|pink|plum|powderblue|purple|red|rosybrown|royalblue|saddlebrown|salmon|sandybrown|seagreen|seashell|sienna|silver|skyblue|slateblue|slategray|snow|springgreen|steelblue|tan|teal|thistle|tomato|turquoise|violet|wheat|white|whitesmoke|yellow|yellowgreen))(?=s*[;{])/gi
替换为：$1#$2（需配合映射表将名称转为小写十六进制）
- 关键防护点：
(? 跳过字符串和 URL -
(?=s*[;{])确保后面紧邻分号或左花括号，排除伪类里的:hover等干扰 - 别用
color这类模糊匹配 —— 会把background-color里的color也干掉
用 PostCSS 插件更稳妥吗？
可以，但要注意插件默认行为未必符合你的项目规范。
-
postcss-color-function不处理命名颜色，别选错 -
postcss-color-hex-alpha只转带 alpha 的rgba()，无关 - 真正可用的是
postcss-nested-color或手写插件，但必须配置ignore: ['custom-property']，否则会把--main-color: red也替换成--main-color: #ff0000，破坏 CSS 变量语义 - PostCSS 替换后无法保留原始空格缩进，可能影响团队格式规范；正则替换能保持原有排版
最易被忽略的一点：CSS 自定义属性（--color-primary: red）和媒体查询中的颜色（@media (prefers-color-scheme: dark)）看起来像颜色名，但完全不是一回事——正则或插件若没排除它们，就会引入错误。动手前先全局搜索 -- 和 prefers-color-scheme，人工确认上下文再跑替换。
