CSS RGB Kleuren

RGB-waarden

In CSS kan de kleur worden gespecificeerd als RGB-waarde met de volgende formule:

rgb(rood, groen, blauw)

elke parameter (rood,groen en blauw) definieert de kleurintensiteit tussen 0 en 255.

Bijvoorbeeld, rgb(255, 0, 0) wordt weergegeven als rood, omdat rood op het hoogste niveau is ingesteld (255), terwijl de andere op 0 zijn.

Om zwart te tonen, stel alle kleurparameters in op 0, zoals hieronder weergegeven: rgb(0, 0, 0).

Om wit te tonen, stel alle kleurparameters in op 255, zoals hieronder weergegeven: rgb(255, 255, 255).

Experimenteer met de volgende RGB-waarden:

 

ROOD

255

GROEN

0

BLAUW

0

Voorbeeld

rgb(255, 0, 0)
rgb(0, 0, 255)
rgb(60, 179, 113)
rgb(238, 130, 238)
rgb(255, 165, 0)
rgb(106, 90, 205)

Probeer het zelf

Normaliter gebruiken we gelijke waarden voor alle 3 lichtbronnen om grijze schaduwen te definiëren:

Voorbeeld

rgb(0, 0, 0)
rgb(60, 60, 60)
rgb(120, 120, 120)
rgb(180, 180, 180)
rgb(240, 240, 240)
rgb(255, 255, 255)

Probeer het zelf

RGBA-waarden

De RGBA-kleurwaarde is een uitbreiding van de RGB-kleurwaarde met een alpha-kanaal - hij specificeert de ondoorzichtigheid van de kleur.

RGBA-kleurwaarden worden gespecificeerd als:

rgba(rood, groen, blauw, alpha)

alpha Parameters zijn getallen tussen 0.0 (volledig doorschijnend) en 1.0 (geen doorschijnendheid):

Experimenteer door de volgende RGBA-waarden te mengen:

 

ROOD

255

GROEN

0

BLAUW

0

ALPHA

0

Voorbeeld

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)

Probeer het zelf