html颜色代码怎么写 十六进制和rgb对照

照着设计稿给按钮写 background: #FF6B35，刷新页面还是白的。查了半天，样式表里写成了 background: #FF6B3，少一位，浏览器直接把这条规则丢了。

十六进制是最常见的一种

html颜色代码用得最多的是 #RRGGBB 六位写法，每两位一组，从 00 到 FF，分别代表红、绿、蓝。FF 是满值，00 是没有。纯红是 #FF0000，纯白 #FFFFFF，纯黑 #000000。六位里如果每组两位相同，可以缩成三位，比如 #FF6633 写成 #F63，浏览器会自己补全。

rgb、rgba 和 hsl 怎么选

rgb(255, 107, 53) 和 #FF6B35 是同一个颜色，只是写法不同。需要透明度就用 rgba，最后一位从 0 到 1，0 是全透明。八位十六进制也能带透明度，末尾两位从 00 到 FF。hsl 按色相、饱和度、亮度描述，调同色系深浅时比改十六进制直观。

color: #FF6B35; background: rgba(255, 107, 53, 0.8); border-color: hsl(14, 100%, 60%);

颜色名和取色工具

red、blue 这些颜色名能用，但一共只有一百多个，饱和度和亮度都是固定的，做设计不够精细。想拿某个颜色的代码，浏览器开发者工具里的吸管点一下就有，PS 和 Figma 的取色器也能直接复制十六进制。复制时注意别漏掉井号，粘贴到代码里再检查一遍。取色器读到的值可能有小数误差，差一两位肉眼基本看不出来。

html颜色代码写错最常见的两种，一是位数不对，二是把 rgb 的括号写进了十六进制。改完颜色记得看对比度，浅灰字配白底在手机上几乎看不清，正文对比度一般建议做到 4.5 比 1 以上。

项目里颜色多，建议统一定义成 CSS 变量，比如 --brand: #FF6B35，换主题只动一处。十六进制不区分大小写，#ff6b35 和 #FF6B35 是同一个值，团队里统一一种写法就行。老浏览器对八位十六进制支持晚一些，面向旧设备就老老实实用 rgba。颜色值不统一，改版时最容易漏掉某个角落的按钮，变量化之后能省不少事。