HTMLRGBおよびRGBAカラー
RGBカラー値は、赤、緑、および青の光源を表します。
RGBAカラー値は、アルファチャネル(不透明度)を備えたRGBの拡張です。
RGBカラー値
HTMLでは、次の式を使用して、色をRGB値として指定できます。
rgb(赤、 緑、青)
各パラメーター(赤、緑、青)は、0〜255の値で色の強度を定義します。
これは、256 x 256 x 256 = 16777216の可能な色があることを意味します。
たとえば、赤は最大値(255)に設定され、他の2つ(緑と青)は0に設定されているため、rgb(255、0、0)は赤として表示されます。
別の例では、緑が最大値(255)に設定され、他の2つ(赤と青)が0に設定されているため、rgb(0、255、0)は緑として表示されます。
黒を表示するには、rgb(0、0、0)のように、すべてのカラーパラメータを0に設定します。
白を表示するには、rgb(255、255、255)のように、すべてのカラーパラメータを255に設定します。
以下のRGB値を組み合わせて実験してください。
rgb(255、99、71)
赤
255
緑
99
青い
71
例
rgb(255, 0, 0)
rgb(0, 0, 255)
rgb(60, 179, 113)
rgb(238, 130, 238)
rgb(255, 165, 0)
rgb(106, 90, 205)
灰色の色合い
灰色の色合いは、多くの場合、3つのパラメーターすべてに等しい値を使用して定義されます。
例
rgb(60, 60, 60)
rgb(100, 100, 100)
rgb(140, 140, 140)
rgb(180, 180, 180)
rgb(200, 200, 200)
rgb(240, 240, 240)
RGBAカラー値
RGBAカラー値は、アルファチャネルを使用したRGBカラー値の拡張です。これは、色の不透明度を指定します。
RGBAカラー値は次のように指定されます。
rgba(赤、 緑、青、アルファ)
alphaパラメータは、0.0(完全に透過的)から1.0(まったく透過的ではない)までの数値です。
以下のRGBA値を組み合わせて実験してください。
rgba(255、99、71、0.5)
赤
255
緑
99
青い
71
アルファ
0.5
例
rgba(255, 99, 71, 0)
rgba(255, 99, 71, 0.2)
rgba(255, 99, 71, 0.4)
rgba(255, 99, 71, 0.6)
rgba(255, 99, 71, 0.8)
rgba(255, 99, 71, 1)