工具概述
CSS 颜色生成器是一款可视化生成 CSS 颜色代码的工具。通过颜色选择器与 alpha 滑条交互，可即时得到 HEX、8 位 HEX（含 alpha）、RGB、RGBA 与 CSS 自定义属性代码，让前端开发者和设计师能快速组装并复制符合 CSS 规范的颜色。
如何使用本工具
第一步 — 使用原生颜色选择器选取颜色（点击色块）或在输入框输入 HEX 值。第二步 — 拖动 Alpha 滑条改变透明度（0 完全透明，1 完全不透明）；下方色块以棋盘背景绘制，便于查看透明效果。第三步 — 点击预设色块可填入常用主题色。第四步 — 在“CSS 代码”面板中，每种格式都有“复制”按钮；结果可直接粘贴到 CSS 文件或组件样式中。
常见使用场景
前端开发者调试组件样式时快速生成带 alpha 通道的颜色（如
rgba(0, 229, 255, 0.5)）；设计系统团队规范化调色板并输出 CSS 变量代码；调整遮罩、蒙层或悬停态的色调；将设计规范中的颜色转为完整 CSS 代码；构建主题切换时迭代颜色选择。技术说明
8 位 HEX 使用
#RRGGBBAA 形式，其中 AA 为 alpha 的十六进制表示（0.5 → 7f），受 CSS Color Module Level 4 支持。RGBA 的 alpha 使用 0-1 的小数。CSS 变量片段使用占位符 --color，可按需重命名。HEX 支持自动将 3 位展开为 6 位。预设色块是设计中常用的鲜明配色集合。隐私与安全
所有颜色生成均在浏览器本地完成，不发起任何网络请求。