十六进制颜色值以#开头，后接3位或6位十六进制字符（0–9、a–f，不区分大小写），分别表示红、绿、蓝分量强度；#rgb为简写（如#f00等价于#ff0000），#rrggbb为标准形式（如#3a86ff）。
十六进制颜色值的基本格式是什么
十六进制颜色值以
开头，后面跟 3 位或 6 位十六进制字符（
和
，不区分大小写），分别表示红（R）、绿（G）、蓝（B）分量的强度。
常见写法包括：
：简写形式，如
等价于
（红色全开，绿蓝为 0）
：标准六位形式，如
（一种蓝色）
注意：没有
前缀的字符串（如
）在 CSS 中无效，
浏览器
会直接忽略
在 CSS 中哪些地方能用十六进制颜色
所有接受颜色值的 CSS 属性都支持十六进制写法，比如
、
、
、
等。
示例：
立即学习
“
前端免费学习笔记（深入）
”；
Comet AI 浏览器
下载 Comet AI 浏览器，体验由 Perplexity AI 驱动的革命性上网方式。内置 AI 助手可实时总结网页、跨标签页对比信息、自动执行任务。告别繁琐操作，让 AI 成为你的浏览副驾，大幅提升研究与工作效率。支持 Windows、macOS、Android 和 iOS。
下载
注意：
和
效果完全一致，但压缩工具通常会把六位转成三位（如果可简化）；反过来，
会被浏览器自动扩展为
，无需手动补全。
十六进制 vs rgb() / hsl()：什么时候该选哪个
十六进制最简洁，适合静态、确定的颜色；但无法直接表达透明度（alpha），也不便于动态调整亮度或饱和度。
要加透明度？必须换
或
，比如
——
本身不带 alpha
需要计算变色（如深色模式下统一调暗）？用
更直观，改一个数值就能调亮度，而十六进制得靠工具换算
团队协作中颜色命名混乱？建议用 CSS 自定义属性统一管理，例如：
，再在各处用
容易被忽略的兼容性和书写陷阱
现代浏览器对十六进制支持极好，但仍有几个细节常出错：
误写成
（八位）：这不是标准 CSS 十六进制，部分浏览器可能解析失败；如需 alpha，请用
（现代语法）或
复制颜色时多空格或换行符：比如从设计稿里粘贴出
（带换行），CSS 解析会中断，务必检查是否干净
大小写混用虽合法（
和
等效），但建议统一小写，避免 Git diff 里无谓的变更
真正麻烦的不是写法本身，而是当多个十六进制值散落在不同文件、不同选择器里，又没用变量管理时，一次品牌色调整就得全局搜替换——这种维护成本，往往比学透
还高。
#0–9a–f#rgb#f00#ff0000#rrggbb#3a86ff#3a86ffcolorbackground-colorborder-colorbox-shadowh1 { color: #2d2d2d; }
.button { background-color: #007bff; border: 1px solid #0056b3; }
::selection { background-color: #ff6b6b; }#000#000000#abc#aabbccrgba()hsla()rgba(58, 134, 255, 0.8)#3a86ffhsl():root { --primary: #3a86ff; }color: var(--primary);#3a86ff80rgb(58 134 255 / 0.5)rgba()#3a86ff↵#3A86FF#3a86ffhsl()