🎨 HEX ↔ RGBA 颜色转换器

HEX 与 RGBA 颜色格式详解

在 Web 开发和 UI 设计中，颜色通常用两种格式表示：HEX（十六进制）和 RGBA（红绿蓝透明度）。

HEX 格式以 # 开头，后跟 6 位或 8 位十六进制数，例如 #e94560 或 #e9456080（含透明度）。它是最常用的 CSS 颜色格式，简洁直观。

RGBA 格式使用 rgba(r, g, b, a) 函数，其中 R、G、B 的取值范围是 0-255，A（透明度）的取值范围是 0-1。例如 rgba(233, 69, 96, 1) 表示不透明的红色。

为什么需要颜色格式转换？

• CSS 开发：不同框架或设计系统可能要求不同的颜色格式，经常需要互转。
• 设计工具衔接：Figma、Sketch、Photoshop 等工具显示的颜色格式可能不同，需要统一转换。
• 透明度处理：HEX 格式的透明度（Alpha 通道）不太直观，转换为 RGBA 更容易理解。

本工具的优势

• 实时预览：输入颜色值即时显示预览效果，包括纯色、白底、深底三种场景。
• 拾色器集成：内置 HTML5 拾色器，点击即可选择颜色。
• 常用色速查：提供常用 Web 安全色快速填充。
• 滑块调节：RGBA 各通道支持滑块和数字输入双模式。