跳到主要内容
Toolars
探索
报告问题

设计 · 本地工具

RGBA 转 HEX

RGBA to HEX Converter

把 rgb()、rgba() 颜色转换为大写 HEX,通道 0–255、alpha 0–1,半透明时输出 #RRGGBBAA 八位写法,alpha 乘 255 四舍五入,百分比写法会被拒绝。

任务路径 / 从输入到结果

输入通道值

本地运行 · 不做任何上传

了解RGBA 转 HEX的使用方法、隐私说明与相关工具

任务路径 / 从输入到结果

如何把 RGBA 颜色转换为 HEX

  1. 01

    输入通道值

    在“RGB 或 RGBA 颜色”输入框中填写 rgb() 或 rgba() 值——输入框初始已填入 rgba(109, 94, 248, 0.8),最多接受 64 个字符。红、绿、蓝为 0 到 255 的整数,alpha 为 0 到 1 的数字;百分比和超出范围的通道会被拒绝。

  2. 02

    执行转换

    点击“转换为 HEX”。解析器会先校验每个通道再转换;只要你修改输入框,之前的结果就会被清除,面板永远不会显示过期的值。

  3. 03

    读取十六进制结果

    结果是大写的十六进制值:完全不透明时为 #RRGGBB,alpha 小于 1 时为 #RRGGBBAA。alpha 字节是 alpha 乘以 255 后四舍五入的结果,因此 0.8 变成 204,写作 CC。

  4. 04

    核对单个通道

    结果通道与预览显示 alpha 量化为 8 位字节后的 HEX 输出颜色。例如输入 alpha 0.65 变为 166/255,显示为 0.65098;这里展示输出效果,而非原样复述输入 alpha。

  5. 05

    加载示例转换

    点击“加载示例”可以观看一次完整运行:rgba(14, 165, 233, 0.65) 会转换为 #0EA5E9A6,因为 0.65 乘以 255 四舍五入为 166,即十六进制的 A6。“重置”恢复默认输入 rgba(109, 94, 248, 0.8)。

  6. 06

    复制或下载结果

    点击“复制输出”复制十六进制值,或点击“下载”保存为 toolars-color-hex.txt。两者在转换成功之前都保持禁用。

工具速览

处理方式
在浏览器本地完成
输入是否离开设备
从不
数据保留
不保存任何内容
价格
免费

你的输入留在浏览器里。

RGBA 转 HEX 使用经过验证的本地执行路径,不会创建隐藏的输入或输出历史记录。

本地执行

在当前浏览器标签页内运行。

无隐藏处理

使用中的工具数据绝不会成为 Toolars 的文档记录。

无需账户

无需创建账户即可使用核心工作流。登录后收藏才会同步到你的账户。

立即重置

关闭标签页,当前的工作数据即刻消失。

RGBA 转 HEX 究竟做什么

设计令牌、老式样式表和很多 API 仍然要求十六进制颜色,而计算后的 CSS 和现代设计工具给你的却是 rgba()。手工换算 rgba(14, 165, 233, 0.65) 意味着三次十进制转十六进制,外加一个 alpha 字节。RGBA 转 HEX 会精确完成这些计算,把透明度保留为八位十六进制,并展示解析出的通道,方便你在复制前核对输入。一切完全在你的设备上运行,不向任何地方发送内容,也无需注册账号。

常见问题

接受什么输入语法?
逗号分隔通道的 rgb(r, g, b) 或 rgba(r, g, b, a):红、绿、蓝必须是 0 到 255 的整数,alpha 是 0 到 1 的数字,比如 0.8 或 .65。写法不区分大小写,也容忍逗号周围的空格;rgb(50%, 30%, 20%) 这样的百分比通道会被有意拒绝。
什么时候输出会带 alpha 字节?
仅当 alpha 小于 1 时。rgba(109, 94, 248, 0.8) 会变成 #6D5EF8CC;同样的颜色在完全不透明时是 #6D5EF8——十六进制写法永远不会带多余的 FF。
alpha 是如何变成最后一个字节的?
alpha 乘以 255 并四舍五入到最近的整数,再写成两位大写十六进制。于是 0.5 变成 128,显示为 80;0.65 四舍五入为 166,显示为 A6——与 CSS 处理八位十六进制颜色的映射完全一致。
为什么我的输入被拒绝了?
提示信息会指出具体问题:通道超过 255、通道不是整数、alpha 超过 1,或格式不是 rgb()/rgba()。解析器刻意严格,是为了让笔误不会悄悄变成错误的颜色。修正取值后重新转换即可——整个过程中没有内容被发送出去。
可以把十六进制转回 rgba() 吗?
可以——使用 HEX 转 RGBA,它接受 #RGB、#RGBA、#RRGGBB 和 #RRGGBBAA,并把 rgba() 字符串的每个通道拆开显示,方便核对。
颜色会被上传到别处吗?
不会。转换完全在当前浏览器标签页内运行,输入和结果不会离开此标签页,也无需注册账号。

继续探索设计

相关任务,而非死胡同。

无需返回完整索引,直接进入另一个专注的工作区。

CSS 加载动画生成器

CSS Loader Generator

可视化设计轨道圆环或跳动三点两种加载动画,画布 24–160 px、周期 0.2–4 秒,导出的 CSS 自带 @keyframes 与减弱动效媒体查询。

创建

CSS 复选框生成器

CSS Checkbox Generator

设计 18–64 px 的自定义复选框外观并预览选中过渡;导出的 CSS 保留真实 input,键盘焦点与读屏播报不受影响,附焦点与禁用状态样式。

创建

CSS 开关生成器

CSS Switch Generator

设计纯 CSS 开关:轨道 44–128 px 宽、滑块 16–56 px,180 ms 滑动过渡;导出保留真实复选框 input,无需 JavaScript,附减弱动效处理。

创建

CSS 裁剪路径生成器

CSS Clip Path Generator

拖动、使用键盘或输入坐标编辑多边形。从四种预设开始,在本地复制 clip-path 声明或完整 CSS。

创建