"我查了半天还是不懂「RGBA」。"——收到这条留言我特别理解。这事儿确实容易被讲复杂，今天我换个角度试试。
关键点清单
颜色模型：RGB(屏幕加色)、CMYK(印刷减色)、HEX(RGB十六进制#RRGGBB)、HSL(色相饱和度亮度)、HSV(色相饱和度明度)。HEX转RGB每两位十六进制转十进制：#FF8800→(255,136,0)。RGBA的A是透明度0-1。写完代码用边界案例测一遍，比读十遍代码都管用。日志要记关键节点和异常，出问题排查全靠它。
详细解释一下
HSL调色直观：色相0-360(红0绿120蓝240)、饱和度0-100%、亮度0-100%。CSS支持hsl(0,100%,50%)。WCAG对比度：正文≥4.5:1(AA)、大字≥3:1。网页安全色216种(00/33/66/99/CC/FF组合)是老概念，现代屏幕已不必要。版本控制和单元测试是基本功，别图省事跳过。多写多测自然熟练，开发就是踩坑填坑的循环。
别忽略这些
先理解概念。RGBA属于开发基础知识，搞懂底层原理(编码规则、算法逻辑、协议规范)比记API更重要。原理通了，换语言换框架都能快速上手。编码统一UTF-8能避免大部分乱码问题，全链路都要统一。能成熟库就别自己造轮子，特别是加密、解析、并发这种容易出错的领域。
具体怎么做
我把流程简化成这几步，你照着来：
- 第一步：确认源格式：HEX/RGB/RGBA/HSL/HSLA/HSV/CMYK
- 第二步：HEX转RGB：每两位十六进制转十进制
- 第三步：RGB转HEX：三个十进制各÷16转两位十六进制
- 第四步：HSL调色：色相0-360(红0绿120蓝240)、饱和度0-100%、亮度0-100%
- 第五步：检测对比度：正文≥4.5:1(AA)、大字≥3:1、AAA≥7:1
几个要注意的地方
下面这几条比正文还重要，别跳过：
- RGBA的A是透明度0-1，HSLA同理
- 网页安全色216种是老概念，现代屏幕已不必要
- WCAG对比度是无障碍硬要求，不是审美问题
- CSS支持hex、rgb()、hsl()等多种写法，hsl()调色最直观
别光看，拿个真实数据算一遍。看十遍不如自己算一遍，这话放哪儿都成立。
常见问题
【HEX颜色和RGB怎么换算？】HEX是RGB的十六进制，#FF8800→FF=255、88=136、00=0→rgb(255,136,0)。每两位十六进制转十进制。RGBA多了透明度A(0-1)，如rgba(255,136,0,0.5)半透明。
【RGBA是什么？】属于开发基础知识范畴，是程序员日常会用到的概念或工具。理解原理(编码/算法/协议)比记API重要，原理通了换语言框架都能快速上手。
【HSL颜色怎么调？】色相0-360选颜色(红0绿120蓝240)、饱和度0-100%调浓淡、亮度0-100%调明暗。比RGB直观，CSS支持hsl(0,100%,50%)。调亮加亮度、调暗减亮度、调淡减饱和度。
【文字和背景颜色对比度多少合适？】WCAG标准正文≥4.5:1(AA级)、大字(18pt+)≥3:1、AAA级正文≥7:1。对比度低影响可读性和无障碍。深色文字配浅色背景，在线工具可检测对比度是否达标。
