TECH I.S.

HTML RGBおよびRGBAカラー


RGBカラー値は、赤、緑、青の光源を表します。

RGBAカラー値は、アルファチャネル(不透明度)を持つRGBの拡張です。


RGBカラー値

HTMLでは、次の式を使用して、色をRGB値として指定できます。

RGB(*赤*、 *緑*、*青*)

各パラメーター(赤、緑、青)は、色の強度を0~255の値で定義します。

これは、256 x 256 x 256 = 16777216色の​​可能性があることを意味します。

たとえば、rgb(255, 0, 0)は赤として表示されます。これは、赤が最高値(255)に設定され、他の2つ(緑と青)が0に設定されているためです。

別の例では、rgb(0, 255, 0)は緑として表示されます。これは、緑が最高値(255)に設定され、他の2つ (赤と青)が0に設定されているためです。

黒を表示するには、rgb(0, 0, 0)のように、すべての色パラメーターを0に設定します。

白を表示するには、次のようにすべての色パラメータを255に設定します: rgb(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)



プログラミング学習を加速させる

プログラミングをプロの講師に教えてもらいませんか。

テックアイエスのプログラミングスクールは初心者も大歓迎です。年齢制限もありません。転職・副業に強く、挫折させない手厚いサポートで稼ぐ力を身につけましょう!

スクールの詳細