CSS: Farben

Vordefinierte Farben

Folgende Grundfarben sind in CSS vordefiniert:

Wert	Beschreibung	Rot	Grün	Blau
`aqua`	Aquamarin	0%	100%	100%
`black`	Schwarz	0%	0%	0%
`blue`	Blau	0%	0%	100%
`fuchsia`	Pink	100%	0%	100%
`gray`	Grau	50%	50%	50%
`green`	Grün	0%	50%	0%
`lime`	Hellgrün, Neongrün	0%	100%	0%
`maroon`	Kastanienbraun	50%	0%	0%
`navy`	Marineblau	0%	0%	50%
`olive`	Olivgrün	50%	50%	0%
`purple`	Purpurrot, Violett	50%	0%	50%
`red`	Rot	100%	0%	0%
`silver`	Silbern, Hellgrau	80%	80%	80%
`teal`	Smaragdgrün	0%	50%	50%
`white`	Weiss	100%	100%	100%
`yellow`	Gelb	100%	100%	0%

Beispiel: roter Text auf schwarzem Hintergrund

body {
  color: red;
  background-color: black;
}

RGB-Farben

In CSS können Farben auch als RGB-Werte definiert werden:

rgb(Rotanteil, Grünanteil, Blauanteil)

Die drei Farbanteile können entweder als Prozentwert oder als Wert zwischen 0 und 255 angegeben werden.

body {
    background-color: rgb(100%, 80%, 0%);
    color: rgb(255, 0, 150);
}

Achtung: Zwischen rgb und der Klammer darf kein Leerzeichen stehen.

Hexadezimale Farbangaben

Eine veraltete, jedoch häufige Methode, RGB-Farben zu definieren, ist die hexadezimale Farbangabe:

#RRGGBB

Hier stehen RR, GG und BB für eine hexadezimale Darstellung der Rot- Grün- und Blauwerte in einem Bereich von 0 bis 255 (0 bis FF hexadezimal). Dabei entspricht ein der Wert FF einem Anteil von 100%.

body {
  background-color: #FFCC00;
}