HTML简历配色须兼顾打印、PDF导出、屏幕阅读与无障碍访问，仅限使用#000、#333、#666、#007bff等灰阶+单强调色，且仅用于border、color等矢量属性，禁用background和渐变。
HTML简历的配色不是审美选择题，而是信息传达的底层约束——它必须在打印、PDF导出、屏幕阅读、无障碍访问多个场景下同时成立。 直接用设计师思维选色，大概率导致导出PDF时文字反白、色块消失，或打印后灰度失真看不清内容。
打印与PDF导出对颜色的实际限制
浏览器渲染和PDF生成引擎（如Chrome Headless、wkhtmltopdf）对CSS颜色的支持不一致。很多“好看”的CSS渐变、半透明色、HSLA值在PDF中会直接降级为纯黑/纯灰，甚至被裁掉。
-
background-color: rgba(0, 120, 255, 0.1)在PDF里常变成全白或全黑，不可控 -
color: hsl(200, 100%, 40%)跨设备渲染差异大，部分PDF工具不识别HSL - 所有背景色（
background）在默认@media print下会被浏览器禁用，除非显式写@media print { background: #fff !important; } - 中文PDF导出最稳妥的颜色组合只有：
#000（正文）、#333（次标题）、#666（描述文本）、#007bff（超链接/强调色），且必须搭配font-weight: normal避免加粗后糊字
行业适配 ≠ 自由发挥，而是克制替换主色值
所谓“金融用蓝色”“设计用橙色”，在HTML简历里不是指整页刷湖蓝渐变，而是仅替换两个可控位置：一级标题边框色 + 超链接a的color。其他所有文本、背景、分割线都应保持中性灰阶。
- IT/工程师：
border-left: 4px solid #007bff（左侧竖条）、a { color: #007bff; text-decoration: underline; } - 设计/创意岗：
border-left: 4px solid #ff6b6b（暖红更显活力，比橙色在灰度打印中更稳） - 教育/医疗：
border-left: 4px solid #4ecdc4（青绿色系，打印后仍可辨识，且无文化歧义） - 法律/金融：
border-left: 4px solid #45b7d1（偏冷的钴蓝，比纯蓝#0000ff更耐灰度压缩）
切记：这些色值只用于border、color、svg stroke等矢量属性；绝不用于background或box-shadow。
立即学习“前端免费学习笔记（深入）”；
字体颜色与背景的对比度是硬门槛
WCAG 2.1 AA标准要求正文文本与背景对比度 ≥ 4.5:1。这意味着如果你用浅灰#f5f5f5做body背景，正文就不能用#666（实测对比度仅2.8），而必须用#333或更深。
- 快速验证：打开Chrome DevTools → Elements → 选中
p或section→ 右侧Styles面板点颜色值旁的色块图标，会直接显示对比度数值 - 安全组合（已实测PDF导出可用）：
background: #fff+color: #222；background: #fafafa+color: #333；background: #f0f4f8+color: #2a3b4c - 深色模式慎用：目前主流PDF导出工具（包括Chrome Print to PDF）不支持
@media (prefers-color-scheme: dark)，强行启用会导致导出全黑页
真正决定HTML简历专业感的，从来不是用了多少种颜色，而是所有颜色是否能在打印纸、HR手机屏幕、ATS系统解析、以及你三年后回看代码时，都保持同一套逻辑。留白、行高、字体栈的稳定性，远比一个“亮眼”的色块重要得多。
