RGB 转 HEX
粘贴 rgb(31, 95, 214)——用逗号还是空格都可以——就能得到 #1f5fd6,可直接用于 CSS、设计文件或规范文档。
- #1f5fd6 HEX
- rgb(31, 95, 214) RGB
- hsl(219, 75%, 48%) HSL
对比度:
- 免费
- 文件不会离开你的设备
- 无需注册
- 不限文件数量
使用方法
- 粘贴 RGB 或 RGBA 值,也可以用取色器选一个颜色。
- 在其他格式上方读取 HEX 代码。
- 点击 HEX 行旁边的「复制」。
实用说明
设计师为什么要 HEX
HEX 是一个整体,而不是三个数字,粘贴到需求文档、工单或聊天里都不会漏掉某一位。它也是设计工具默认显示的写法,因此用 HEX 写下的色板与大家眼前看到的一致。
透明通道会变成什么
如果传入带透明度的 rgba(),结果是八位 HEX:最后一对表示 0 到 255 的透明度。新版浏览器能正确读取,旧版不能——所以在需要广泛兼容的地方仍应保留 rgba()。
常见问题
必须把数字写在 rgb(...) 里吗?
支持完整写法,逗号或空格分隔均可,rgb() 和 rgba() 都行。超过 255 的数值会被限制到上限,而不是悄悄回绕。
为什么我的 HEX 有八位?
因为颜色带有透明通道。去掉透明度就会得到常见的六位代码。
会向服务器发送内容吗?
不会。整个转换都在页面内完成,尚未公开的品牌配色仍留在你手里。
相关工具
- 颜色转换器 用任何常见写法输入颜色——#1f5fd6、1f5fd6、#1f5、rgb(31, 95, 214)——其余写法会同时出现,还附带保证文字可读所需的对比度数值。
- HEX 转 RGB 粘贴 HEX 代码,读出 RGB 通道值。#1f5fd6 会变成 rgb(31, 95, 214);如果代码带有透明通道,你会得到保留透明度的 rgba()。
- 密码生成器 打开页面即生成新密码,使用浏览器的加密级随机数生成器。密码不会被发送、记录或保存。
- 配色生成器 选一个起始颜色,工具会按色轮算出其余的颜色。点击任意色块即可复制色值,或者放入一张照片,直接从中取出配色。
- CSS 渐变生成器 拖动滑块,上方的预览会跟着变化。满意之后复制那一行,粘贴进样式表就行了,不需要别的。
- CSS 阴影生成器 拖动滑块,示例会跟着变。一层不够就叠加图层 — 真实界面里那种柔和可信的立体感就是这样做出来的。
- 取色器 在色板上滑动来挑颜色,或者取现成的:用吸管从图片上取,浏览器支持的话还能直接从屏幕上取。三种写法的代码立刻出现。