16進カラーからRGBAカラーへのオンライン変換ツール
について16進カラーからRGBAカラーへのオンライン変換ツール:
このオンラインHexカラーからRGBAカラーへの変換ツールを使用すると、HexカラーをRGBAカラー(透明度不透明度を含む)に変換し、選択したカラーをリアルタイムでテストできます。
16進数カラーシステム:
HTML表色系は、 #000000 (真っ黒)から#FFFFFF (真っ白)までの16進数で表すことができますたとえば、 #123456赤チャンネルが "12"( "00"と "FF"の間)である#123456ます.緑色のチャンネルは "34"、青色のチャンネルは "56"です. #e1a 16進数のカラーシステムでは#e1aと#ee11aaが同じように簡略表示もサポートされています.
RGBA表色系:
RGBA表色系では、 "R"は赤チャンネル( "Red")、 "G"は緑チャンネル( "Green")、 "B"は青チャンネル( "Blue")、Aは透明度( rgba(16,110,190,0.7) )を表します. rgba(16,110,190,0.7)
HexカラーをRGBAカラーに変換する方法
手順1:16進数カラーの赤のチャンネル値、緑のチャンネル値、青のチャンネル値、透明度の値をそれぞれ取得します.
ステップ2:カラーチャンネル値を16進数から10進数に変換します.
手順3:RGBA表色系の構文に従って、3つのカラーチャンネル値を組み合わせます.
例1:16進数の色 "#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:16進数の色 "#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での16進カラーから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%