Hex颜色到RGBA颜色在线转换工具


Hex颜色#

透明度(Opacity)%

RGBA颜色

关于Hex颜色到RGBA颜色在线转换工具:

这个在线Hex颜色到RGBA颜色转换工具可帮助您将一个Hex颜色转换为RGBA颜色(包括透明度Opacity), 并实时测试您选择的颜色.

Hex颜色系统:

HTML的颜色系统可以用16进制的数字表示,从 #000000 (纯黑色) to #FFFFFF (纯白色).例如,#123456代表红色通道是 "12" (在"00" 到 "FF" 之间). 绿色通道是 "34", 蓝色通道是 "56". Hex颜色系统也支持简化显示,例如 #e1a#ee11aa 是等价的.

RGBA颜色系统:

RGBA颜色系统中 "R" 代表红色通道("Red"), "G" 代表绿色通道 ("Green"), "B" 代表蓝色通道("Blue"),A代表透明度(Opacity).例如 rgba(16,110,190,0.7).

comic hex to rgba

如何进行Hex颜色到RGBA颜色转换?

  1. 步骤1: 分别获得Hex颜色的红色通道值,绿色通道值,蓝色通道值 和透明度值.

  2. 步骤2: 把颜色通道值从16进制转换为10进制.

  3. 步骤3: 按RGBA颜色系统语法把3种颜色通道值组合起来.

例1: 把Hex颜色 "#106ebe" (透明度 80%) 转换为RGBA颜色 (结果是 "rgba(16,110,190,0.8)"):

Step 1: Hex Color "#106ebe": Red(0x10), Green(0x6e), Blue(0xbe)
Step 2: Red: (0x10)->(16), Green: (0x6e)->(110), Blue: (0xbe)->(190)
Step 3: Hex Color "#106ebe" opacity 80% -> rgba(16,110,190,0.8)

例1: 把Hex颜色 "#ea3" (透明度 100%) 转换为RGBA颜色 (结果是 "rgba(238,170,51,1)"):

Step 1: Hex Color "#ea3" -> "#eeaa33"
Step 2: Hex Color "#eeaa33": Red(0xee), Green(0xaa), Blue(0x33)
Step 3: Red: (0xee)->(238), Green: (0xaa)->(170), Blue: (0x33)->(51)
Step 4: Hex Color "#ea3", opacity 100% -> rgba(238,170,51,1)

链接:

维基百科 (Web颜色系统): https://en.wikipedia.org/wiki/Web_colors

维基百科 (RGBA颜色系统): https://en.wikipedia.org/wiki/RGBA_color_space

用Python进行Hex颜色到RGBA颜色转换:

import re


def rgba_to_hex(rgba_color):
    rgb_color = re.search('\(.*\)', rgba_color).group(0).replace(' ', '').lstrip('(').rstrip(')')
    [r, g, b, o] = rgb_color.split(',')
    [r, g, b] = [int(x) for x in [r, g, b]]
    o = float(o) * 100
    o = str(o) + '%'

    # check if in range 0~255
    assert 0 <= r <= 255
    assert 0 <= g <= 255
    assert 0 <= b <= 255

    r = hex(r).lstrip('0x')
    g = hex(g).lstrip('0x')
    b = hex(b).lstrip('0x')
    # re-write '7' to '07'
    r = (2 - len(r)) * '0' + r
    g = (2 - len(g)) * '0' + g
    b = (2 - len(b)) * '0' + b

    hex_color = '#' + r + g + b + ', with opacity:' + o
    return hex_color


rgba_input = 'rgba(7,110,190,0.95)'
hex_output = rgba_to_hex(rgba_input)
print('Hex color result is:{0}'.format(hex_output))

-------------------
Hex color result is:#076ebe, with opacity:95.0%
相关工具 16进制到10进制转换 10进制到16进制转换 8进制到10进制转换 10进制到8进制转换 2进制到10进制转换 10进制到2进制转换 ASCII查询表 16进制到ASCII字符串转换 ASCII字符串到16进制转换 分数到小数转换 小数到分数转换 百分比到小数转换 小数到百分比转换 百分比到分数转换 分数到百分比转换 Hex颜色到RGB颜色转换 RGB颜色到Hex颜色转换 Hex颜色到RGBA颜色转换 RGBA颜色转Hex颜色转换 罗马数字对照表 1-1000 罗马数字到阿拉伯数字转换 阿拉伯数字到罗马数字转换
其它类型工具 格式化&压缩 网络测试 哈希值计算&密码 数字进制转换