TECH I.S.

CSS RGB カラー


RGBカラー値は、RED、GREEN、および BLUEの光源を表します。


RGB値

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

RGB(red, green, blue)

各パラメーター (red, green, blue) は、0~255の色の強度を定義します。

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

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

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

以下のRGB値を混ぜてみてください。

rgb(255, 99, 71)

red

255

green

99

blue

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(90, 90, 90)
rgb(120, 120, 120)
rgb(180, 180, 180)
rgb(210, 210, 210)
rgb(240, 240, 240)


RGBA値

RGBAカラー値は、RGBカラー値をアルファチャネルで拡張したもので、色の不透明度を指定します。

RGBAカラー値は次のように指定されます。

rgba(red、green、blue、alpha)

alphaパラメーターは、0.0(完全に透明)から1.0(まったく透明ではない)までの数値です。

以下のRGBA値を混合して実験します。

rgba(255, 99, 71, 0.5)

red

255

green

99

blue

71

alpha

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)



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

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

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

スクールの詳細