0

エンコード結果

RGB カラー (16進)
表記
RGB カラー
カラースペース
表記

RGBカラーについて

RGBカラーは、赤 (Red)、緑 (Green)、青 (Blue) の3つの光の成分を組み合わせて色を表すカラーモデルです。ディスプレイ、Webページ、画像データなど、画面上で扱う色の表現として広く使用されています。

RGBでは、各成分の強さを数値で指定します。一般的には 0 から 255 の整数、または 0% から 100% のパーセンテージで表します。すべての成分が 0 の場合は黒、すべての成分が最大の場合は白になります。

RGB表記16進表記
rgb(255 0 0)#ff0000
rgb(0 128 0)#008000
rgb(0 0 255)#0000ff
rgb(255 255 255)#ffffff
rgb(0 0 0)#000000

RGBカラーには、関数形式と16進形式があります。例えば赤は、rgb(255 0 0)rgb(100% 0% 0%)#ff0000#f00 のように表せます。

透明度を含める場合は、アルファ値を追加します。例えば、半透明の赤は rgb(255 0 0 / 50%)#ff000080 のように表せます。

DenCodeのRGBカラー変換では、以下の表記オプションに対応しています。

RGBカラー (16進)
表記オプションフォーマット
#RRGGBB(AA)#RRGGBB
#RRGGBBAA
#ff0000
#ff000080
0xAARRGGBB0xAARRGGBB0xffff0000
0x80ff0000
RGBカラー
表記オプションフォーマット
数値rgb(R G B)
rgb(R G B / A)
rgb(255 0 0)
rgb(255 0 0 / 0.5)
パーセンテージrgb(R% G% B%)
rgb(R% G% B% / A)
rgb(100% 0% 0%)
rgb(100% 0% 0% / 0.5)

0xAARRGGBB はCSSの標準的な16進カラー表記ではありませんが、プログラムやアプリケーション設定で使われることがあるARGB形式です。先頭の AA がアルファ、続く RRGGBB が赤、緑、青の成分を表します。

sRGBとその他のRGBカラースペース

RGBは、赤、緑、青の3成分で色を表すカラーモデルです。ただし、同じRGB値でも、どのカラースペースで解釈するかによって実際の色は異なります。Webで一般的な rgb()#RRGGBB は、通常はsRGBカラースペースの色として扱われます。

CSS Color Module Level 4では、Display P3 や ProPhoto RGB など、sRGBとは扱える色の範囲が異なるRGBカラースペースも定義されています。DenCodeでは、これらのカラースペースの変換にも対応しています。

カラースペースフォーマット特徴
sRGBrgb(...)
color(srgb ...)
rgb(255 0 0)
color(srgb 1 0 0)
WebやCSSで一般的なRGBカラースペースです。16進カラーコードや通常の rgb() は、基本的にsRGBとして扱われます。color(srgb ...) はCSS Color Module Level 4のフォーマットです。
Linear sRGBcolor(srgb-linear ...)color(srgb-linear 1 0 0)sRGBと同じ色域を、線形化した成分値で表すカラースペースです。色の計算や合成で使われます。
Display P3color(display-p3 ...)color(display-p3 1 0 0)sRGBより広い色域を持ち、広色域ディスプレイやモバイル端末で使われることがあります。
Adobe RGB (1998)color(a98-rgb ...)color(a98-rgb 1 0 0)sRGBより広い色域を持ち、写真編集や印刷向けのワークフローで使われることがあります。
ProPhoto RGBcolor(prophoto-rgb ...)color(prophoto-rgb 1 0 0)Adobe RGBよりさらに広い色域を扱えるRGBカラースペースで、写真編集の作業用カラースペースとして使われます。
Rec. 2020color(rec2020 ...)color(rec2020 1 0 0)非常に広い色域を持つRGBカラースペースで、UHDTVやHDR映像の規格で使われます。

広い色域のRGBカラースペースで指定した色は、sRGBの画面や通常の16進カラーコードでは正確に表せない場合があります。DenCodeで #RRGGBB や数値の rgb(R G B) に変換する場合、sRGBで表せる範囲外の成分は 0 から 255 の範囲に収まるように扱います。一方、color(display-p3 ...)color(a98-rgb ...) などのカラースペースを選ぶと、選択したカラースペースの成分値として表示できます。