<color>

Übersicht

Der CSS Datentyp beschreibt eine Farbe im sRGB Farbraum. Eine Farbe kann auf eine dieser Arten beschrieben werden:

durch Benutzung eines Schlüsselworts
durch Benutzung des kubischen RGB Koordinatensystems (durch #-hexadezimal oder die funktionalen Schreibweisen rgb() und rgba())
durch Benutzung des zylindrischen HSL Koordinatensystems (durch die funktionalen Schreibweisen hsl() und hsla())

Beachte, dass die Liste an akzeptierten Farbwerten durch weiterentwickelte Spezifikationen erweitert wurde bis hin zu den neuesten CSS3 Farben.

In Verbindung mit einer Farbe im sRGB Raum besteht ein <color>-Wert auch aus einer Alphakanal-Koordinate, einem Transparenzwert, der angibt, wie die Farbe mit der Hintergrundfarbe vermischt wird

Obwohl CSS Farbwerte genau definiert sind, können sie auf verschiedenen Ausgabegeräten unterschiedlich dargestellt werden. Die meisten davon sind nicht kalibriert und manche Browser unterstützen nicht das Farbprofil des Ausgabegeräts. Ohne diese kann die Farbdarstellung stark variieren.

Hinweis: Die WCAG 2.0 Empfehlung des W3C rät Webauthoren ausdrücklich dazu, Farben nicht als einziges Mittel zur Vermittlung einer bestimmten Information, Aktion oder einem Ergebnis zu verwenden. Manche Benutzer haben Probleme, Farben zu unterscheiden, was das Verständnis der übermittelten Information verhindert. Natürlich verhindert das nicht die Benutzung von Farbe, nur deren Benutzung als einziges Mittel eine Information zu beschreiben.

Interpolation

Werte des <color> CSS Datentyps können für Animationen und zur Erstellung von <gradient> Werten interpoliert werden. In diesem Fall werden ihre Rot-, Grün- und Blau-Komponenten als eine reale Fließkommazahl interpoliert. Beachte, dass die Interpolation von Farben innerhalb des alpha-vormultiplizierten sRGBA-Farbraums stattfindet, um unerwartete Grautöne zu verhindern. In Animationen wird die Geschwindigkeit der Interlolation durch die zur Animation gehörenden Timing-Funktion bestimmt.

Werte

Es gibt mehrere Arten, wie ein <color> Wert beschrieben werden kann.

Farbschlüsselwörter

Farbschlüsselwörter sind schreibungsunabhängige Bezeichner, welche eine bestimmte Farbe repräsentieren, z. B. red, blue, brown, lightseagreen. Der Name beschreibt die Farbe, er ist jedoch meist erfunden. Die Liste an akzeptierten Werten variiert sehr zwischen den Spezifikationen:

CSS Level 1 akzeptierte nur 16 Grundfarben, bekannt als VGA-Farben, weil sie aus der Menge an darstellbaren Farben von VGA-Grafikkarten stammen.
CSS Level 2 fügte das orange-Schlüsselwort hinzu.
Von Anfang an haben Browser weitere Farben akzeptiert, meist die X11 genannte Farbliste, da einige frühere Browser X11-basierte Anwendungen waren, allerdings mit einigen Unterschieden. SVG 1.0 war der erste Standard, der diese Schlüsselwörter formal definiert hat; CSS Colors Level 3 hat diese Schlüsselwörter ebenfalls formal definiert. Sie werden oft als erweiterte Farbschlüsselwörter, X11 Farben oder SVG Farben bezeichnet.

Es gibt ein paar Dinge bei der Verwendung von Farbschlüsselwörtern zu beachten:

Außer den 16 Grundfarben, die HTML gemein hat, können keine anderen Farben in HTML verwendet werden. HTML konvertiert diese unbekannten Werte mit einem bestimmten Algorithmus, was zu komplett unterschiedlichen Farben führt. Diese Schlüsselwörter sollten ausschließlich in SVG & CSS verwendet werden.
Unknown keywords make the CSS property invalid. Invalid properties being ignored, the color will have no effect. This is a different behavior than the one of HTML.
Keine als Schlüsselwort definierten Farben haben in CSS eine Transparenz. Sie sind klare, undurchsichtige Farben.
Verschiedene Schlüsselwörter kennzeichnen die gleiche Farbe:
- darkgray / darkgrey
- darkslategray / darkslategrey
- dimgray / dimgrey
- lightgray / lightgrey
- lightslategray / lightslategrey
- gray / grey
- slategray / slategrey
Obwohl die Namen der Schlüsselwörter von den gewöhnlichen X11-Farbnamen stammen, können die Farben von den entsprechenden Systemfarben im X11-System abweichen, da sie auf die spezielle Hardware der Hersteller zugeschnitten sind.

Spezifikation	Farbe	Schlüsselwort	RGB Hexwerte
CSS Level 1		`black`	`#000000`
		`silver`	`#c0c0c0`
		`gray`	`#808080`
		`white`	`#ffffff`
		`maroon`	`#800000`
		`red`	`#ff0000`
		`purple`	`#800080`
		`fuchsia`	`#ff00ff`
		`green`	`#008000`
		`lime`	`#00ff00`
		`olive`	`#808000`
		`yellow`	`#ffff00`
		`navy`	`#000080`
		`blue`	`#0000ff`
		`teal`	`#008080`
		`aqua`	`#00ffff`
CSS Level 2 (Revision 1)		`orange`	`#ffa500`
CSS Color Module Level 3		`aliceblue`	`#f0f8ff`
		`antiquewhite`	`#faebd7`
		`aquamarine`	`#7fffd4`
		`azure`	`#f0ffff`
		`beige`	`#f5f5dc`
		`bisque`	`#ffe4c4`
		`blanchedalmond`	`#ffe4c4`
		`blueviolet`	`#8a2be2`
		`brown`	`#a52a2a`
		`burlywood`	`#deb887`
		`cadetblue`	`#5f9ea0`
		`chartreuse`	`#7fff00`
		`chocolate`	`#d2691e`
		`coral`	`#ff7f50`
		`cornflowerblue`	`#6495ed`
		`cornsilk`	`#fff8dc`
		`crimson`	`#dc143c`
		`darkblue`	`#00008b`
		`darkcyan`	`#008b8b`
		`darkgoldenrod`	`#b8860b`
		`darkgray`	`#a9a9a9`
		`darkgreen`	`#006400`
		`darkgrey`	`#a9a9a9`
		`darkkhaki`	`#bdb76b`
		`darkmagenta`	`#8b008b`
		`darkolivegreen`	`#556b2f`
		`darkorange`	`#ff8c00`
		`darkorchid`	`#9932cc`
		`darkred`	`#8b0000`
		`darksalmon`	`#e9967a`
		`darkseagreen`	`#8fbc8f`
		`darkslateblue`	`#483d8b`
		`darkslategray`	`#2f4f4f`
		`darkslategrey`	`#2f4f4f`
		`darkturquoise`	`#00ced1`
		`darkviolet`	`#9400d3`
		`deeppink`	`#ff1493`
		`deepskyblue`	`#00bfff`
		`dimgray`	`#696969`
		`dimgrey`	`#696969`
		`dodgerblue`	`#1e90ff`
		`firebrick`	`#b22222`
		`floralwhite`	`#fffaf0`
		`forestgreen`	`#228b22`
		`gainsboro`	`#dcdcdc`
		`ghostwhite`	`#f8f8ff`
		`gold`	`#ffd700`
		`goldenrod`	`#daa520`
		`greenyellow`	`#adff2f`
		`grey`	`#808080`
		`honeydew`	`#f0fff0`
		`hotpink`	`#ff69b4`
		`indianred`	`#cd5c5c`
		`indigo`	`#4b0082`
		`ivory`	`#fffff0`
		`khaki`	`#f0e68c`
		`lavender`	`#e6e6fa`
		`lavenderblush`	`#fff0f5`
		`lawngreen`	`#7cfc00`
		`lemonchiffon`	`#fffacd`
		`lightblue`	`#add8e6`
		`lightcoral`	`#f08080`
		`lightcyan`	`#e0ffff`
		`lightgoldenrodyellow`	`#fafad2`
	`lightgray`	`#d3d3d3`
	`lightgreen`	`#90ee90`
	`lightgrey`	`#d3d3d3`
	`lightpink`	`#ffb6c1`
	`lightsalmon`	`#ffa07a`
	`lightseagreen`	`#20b2aa`
	`lightskyblue`	`#87cefa`
	`lightslategray`	`#778899`
	`lightslategrey`	`#778899`
	`lightsteelblue`	`#b0c4de`
	`lightyellow`	`#ffffe0`
	`limegreen`	`#32cd32`
	`linen`	`#faf0e6`
	`mediumaquamarine`	`#66cdaa`
	`mediumblue`	`#0000cd`
	`mediumorchid`	`#ba55d3`
	`mediumpurple`	`#9370db`
	`mediumseagreen`	`#3cb371`
	`mediumslateblue`	`#7b68ee`
	`mediumspringgreen`	`#00fa9a`
	`mediumturquoise`	`#48d1cc`
	`mediumvioletred`	`#c71585`
	`midnightblue`	`#191970`
	`mintcream`	`#f5fffa`
	`mistyrose`	`#ffe4e1`
	`moccasin`	`#ffe4b5`
	`navajowhite`	`#ffdead`
	`oldlace`	`#fdf5e6`
	`olivedrab`	`#6b8e23`
	`orangered`	`#ff4500`
	`orchid`	`#da70d6`
	`palegoldenrod`	`#eee8aa`
	`palegreen`	`#98fb98`
	`paleturquoise`	`#afeeee`
	`palevioletred`	`#db7093`
	`papayawhip`	`#ffefd5`
	`peachpuff`	`#ffdab9`
	`peru`	`#cd853f`
	`pink`	`#ffc0cb`
	`plum`	`#dda0dd`
	`powderblue`	`#b0e0e6`
	`rosybrown`	`#bc8f8f`
	`royalblue`	`#4169e1`
	`saddlebrown`	`#8b4513`
	`salmon`	`#fa8072`
	`sandybrown`	`#f4a460`
	`seagreen`	`#2e8b57`
	`seashell`	`#fff5ee`
	`sienna`	`#a0522d`
	`skyblue`	`#87ceeb`
	`slateblue`	`#6a5acd`
	`slategray`	`#708090`
	`slategrey`	`#708090`
	`snow`	`#fffafa`
	`springgreen`	`#00ff7f`
	`steelblue`	`#4682b4`
	`tan`	`#d2b48c`
	`thistle`	`#d8bfd8`
	`tomato`	`#ff6347`
	`turquoise`	`#40e0d0`
	`violet`	`#ee82ee`
	`wheat`	`#f5deb3`
	`whitesmoke`	`#f5f5f5`
	`yellowgreen`	`#9acd32`
CSS Color Module Level 4		`rebeccapurple`	`#663399`

Die Farbe rebeccapurple entspricht der Farbe #639. Mehr Informationen darüber, warum sie eingeführt wurde, kann in diesem Codepen Blog Post von Trezy nachgelesen werden: "Honoring a Great Man."

`transparent` Schlüsselwort

Das transparent-Schlüsselwort beschreibt eine vollkommen transparente Farber, d. h. die dargestellte Farbe ist die Hintergrundfarbe. Technisch ist sie schwarz mit einem Alphakanal mit Minimalwert und ist ein Kürzel für rgba(0,0,0,0).

Historischer Hinweis
Das Schlüsselwort transparent war keine echte Farbe in CSS Level 2 (Revision 1). Es war ein spezifisches Schlüsselwort, das bei zwei CSS-Eigenschaften anstelle eines regulären <color>-Wertes verwendet werden konnte: background und border. Es war eigentlich hinzugefügt, um geerbte Festfarben zu überschreiben.

Mit der Unterstützung der Deckkraft durch den Alphakanal, wurde transparent in CSS Colors Level 3 neudefiniert als eine echte Farbe, die überall dort verwendet werden kann, wo ein <color>-Wert benötigt wird, wie der color Eigenschaft.

`currentColor` Schlüsselwort

Das currentColor-Schlüsselwort beschreibt den berechneten Wert der color Eigenschaft des Elements. Es erlaubt, die Farbeigenschaften, die von Eigenschaften oder Kindelementeigenschaften zu vererben, die sie normalerweise nicht vererben.

Es kann auch für Eigenschaften verwendet werden, die den berechneten Wert der color Eigenschaft des Elements erben und entspricht dem inherit Schlüsselwort bei diesen Elementen, falls es welche gibt.

Live-Beispiel

Die Farbe der Zeile (ein farbgefülltes <div>) passt sich der Farbe der color Eigenschaft an, die von seinem Elternelement geerbt wird.

Live-Beispiel 1

<div style="color:darkred;">
 Die Farbe dieses Texts ist dieselbe wie die der Zeile:
 <div style="background:currentcolor; height:1px;"></div>
 Mehr Text.
</div>

Live-Beispiel 2

<div style="color:blue; border-bottom: 1px dashed currentcolor;">
 Die Farbe dieses Texts ist dieselbe wie die der Zeile:
 <div style="background:currentcolor; height:1px;"></div>
 Mehr Text.
</div>

`rgb()`

Farben können durch das Rot-Grün-Blau-Modell (RGB-Modell) auf zwei Weisen definiert werden:

Hexadezimale Notation #RRGGBB und #RGB

"#", gefolgt von sechs hexadezimalen Zeichen (0-9, A-F).
"#", gefolgt von drei hexadezimalen Zeichen (0-9, A-F).

Die Drei-Ziffern-RGB-Notation (#RGB) und die Sechs-Ziffern-Form (#RRGGBB) sind gleich.
Zum Beispiel repräsentieren #f03 und #ff0033 dieselbe Farbe.

Funktionelle Notation rgb(R,G,B)

"rgb", gefolgt von drei <integer> oder drei <percentage> Werten.
Die Ganzzahl 255 entspricht 100% und F oder FF in der hexadezimalen Schreibweise.

/* Diese Beispiele definieren alle dieselbe RGB-Farbe: */
 
 #f03
 #F03
 #ff0033
 #FF0033
 rgb(255,0,51)
 rgb(255, 0, 51)
 rgb(255, 0, 51.2) /* FEHLER! Keine Bruchzahlen verwenden, nur Ganzzahlen. */ 
 rgb(100%,0%,20%)
 rgb(100%, 0%, 20%)
 rgb(100%, 0, 20%) /* FEHLER! Ganzzahl- und Prozentschreibweise dürfen nicht gemischt werden. */

`hsl()`

Farben können auch durch das Hue-Saturation-Lightness-Modell (HSL-Modell) unter Verwendung der funktionellen Notation hsl() definiert werden. Der Vorteil von HSL gegenüber RGB ist, dass es wesentlich intuitiver ist: man kann die Zahlen, die man haben will, erraten und dann anpassen. Es ist auch einfacher, Sets passender Farben zu erstellen (indem der Farbwert unverändert bleibt und die Helligkeit/Dunkelheit und Sättigung verändert werden).

Der Farbwert wird als ein Winkel des Farbkreises angegeben (d. h. der Regenbogen als Kreis dargestellt). Der Winkel wird als einheitenlose <number> angegeben. Per definition red=0=360 und die anderen Farben sind so auf den Kreis verteilt, sodass green=120, blue=240, etc. Als Winkel bricht er implizit um, sodass 120=240 und 480=120.

Sättigung und Helligkeit werden als Prozentwert angegeben.
100% entspricht voller Sättigung und 0% ist ein Grauton.
100% Helligkeit ist weiß, 0% Helligkeit ist schwarz und 50% Helligkeit ist "normal".

hsl(0,  100%,50%)    /* rot */       
hsl(30, 100%,50%)                     
hsl(60, 100%,50%)                    
hsl(90, 100%,50%)                    
hsl(120,100%,50%)    /* grün */      
hsl(150,100%,50%)                    
hsl(180,100%,50%)                    
hsl(210,100%,50%)                    
hsl(240,100%,50%)    /* blau */      
hsl(270,100%,50%)                    
hsl(300,100%,50%)                    
hsl(330,100%,50%)                    
hsl(360,100%,50%)    /* rot */       

hsl(120,100%,25%)    /* dunkelgrün */
hsl(120,100%,50%)    /* grün*/       
hsl(120,100%,75%)    /* hellgrün */  

hsl(120,100%,50%)    /* grün */      
hsl(120, 67%,50%)                    
hsl(120, 33%,50%)                    
hsl(120,  0%,50%)                    

hsl(120, 60%,70%)    /* pastelgrün */

`rgba()`

Farben können durch das Rot-Grün-Blau-Model (RGB-Modell) unter Verwendungn der funktionellen Notation rgba() verwendet werden. RGBa erweitert das RGB-Farbmodell um einen Alphakanal, der die Deckkraft einer Farbe angibt.
a bedeutet Deckkraft: 0=transparent; 1=undurchsichtig;

rgba(255, 0, 0, 0.1)    /* 10% undurchsichtiges Rot */      
rgba(255, 0, 0, 0.4)    /* 40% undurchsichtiges Rot */      
rgba(255, 0, 0, 0.7)    /* 70% undurchsichtiges Rot */      
rgba(255, 0, 0, 1)      /* komplett undurchsichtiges Rot */

`hsla()`

Farben können auch durch das Hue-Saturation-Lightness-Alpha-Modell (HSLa-Modell) unter Verwendung der funktionellen Notation hsla() definiert werden. HSLa erweitert das HSL-Farbmodell um einen Alphakanal, der die Deckkraft einer Farbe angibt.
a bedeutet Deckkraft: 0=transparent; 1=undurchsichtig;

hsla(240, 100%, 50%, 0.05)    /* 5% undurchsichtiges Blau */   
hsla(240,100%,50%, 0.4)       /* 40% undurchsichtiges Blau */  
hsla(240,100%,50%, 0.7)       /* 70% undurchsichtiges Blau */  
hsla(240,100%,50%,   1)       /* full undurchsichtiges Blau */

Systemfarben

Nicht alle Systemfarben werden von allen Systemen unterstützt. für die Benutzung in öffentlichen Webseiten.

ActiveBorder: Rahmenfarbe eines aktiven Fensters.
ActiveCaption: Titelfarbe eines aktiven Fensters. Sollte mit der Vordergrundfarbe CaptionText verwendet werden.
AppWorkspace: Hintergrundfarbe einer Mehrfachdokumentschnittstelle (MDI).
Background: Desktophintergrund.
ButtonFace: Schaltflächenfarbe für 3D-Elemente, die durch eine Ebene umgebender Rahmen dreidimensional erscheinen. Sollte mit der Vordergrundfarbe ButtonText verwendet werden.
ButtonHighlight: Farbe des dem Licht zugewandten Rahmens eines 3D-Elements, das durch diesen Rahmen dreidimensional erscheint.
ButtonShadow: Farbe des dem Licht abgewandten Rahmens eines 3D-Elements, das durch diesen Rahmen dreidimensional erscheint.
ButtonText: Text auf Schaltflächen. Sollte mit der Hintergrundfarbe ButtonFace oder ThreeDFace verwendet werden.
CaptionText: Farbe des Titeltexts in Fenstern. Sollte mit der Hintergrundfarbe ActiveCaption verwendet werden.
GrayText: Farbe für ausgegrauten (deaktivierten) Text.
Highlight: Farbe für ausgewählte Elemente in einem Steuerelement. Sollte mit der Vordergrundfarbe HighlightText verwendet werden.
HighlightText: Farbe des Texts ausgewählter Elemente in einem Steuerelement. Sollte mit der Hintergrundfarbe Highlight verwendet werden.
InactiveBorder: Rahmenfarbe eines inaktiven Fensters.
InactiveCaption: Titelfarbe eines inaktiven Fensters. Sollte mit der Vordergrundfarbe InactiveCaptionText verwendet werden.
InactiveCaptionText: Farbe des Titeltexts in inaktiven Fenstern. Sollte mit der Hintergrundfarbe InactiveCaption verwendet werden.
InfoBackground: Hintergrundfarbe für Tooltips. Sollte mit der Vordergrundfarbe InfoText verwendet werden.
InfoText: Textfarbe für Tooltips. Sollte mit der Hintergrundfarbe InfoBackground verwendet werden.
Menu: Hintergrundfarbe von Menüs. Sollte mit der Vordergrundfarbe MenuText oder -moz-MenuBarText verwendet werden.
MenuText: Textfarbe von Menüs. Sollte mit der Hintergrundfarbe Menu verwendet werden.
Scrollbar: Hintergrundfarbe von Scrollleisten.
ThreeDDarkShadow: Farbe des dunkleren (normalerweise äußeren) der dem Licht abgewandten zweier Rahmen für 3D-Elemente, die durch zwei Ebenen umgebender konzentrischer Rahmen dreidimensional erscheinen.
ThreeDFace: Schaltflächenfarbe für 3D-Elemente, die durch zwei Ebenen umgebender konzentrischer Rahmen dreidimensional erscheinen. Sollte mit der Vordergrundfarbe ButtonText verwendet werden.
ThreeDHighlight: Farbe des helleren (normalerweise äußeren) der dem Licht zugewandten zweier Rahmen für 3D-Elemente, die durch zwei Ebenen umgebender konzentrischer Rahmen dreidimensional erscheinen.
ThreeDLightShadow: Farbe des dunkleren (normalerweise inneren) der dem Licht zugewandten zweier Rahmen für 3D-Elemente, die durch zwei Ebenen umgebender konzentrischer Rahmen dreidimensional erscheinen.
ThreeDShadow: Farbe des helleren (normalerweise inneren) der dem Licht abgewandten zweier Rahmen für 3D-Elemente, die durch zwei Ebenen umgebender konzentrischer Rahmen dreidimensional erscheinen.
Window: Fensterhintergrundfarbe. Sollte mit der Vordergrundfarbe WindowText verwendet werden.
WindowFrame: Fensterrahmenfarbe.
WindowText: Textfarbe in Fenstern. Sollte mit der Hintergrundfarbe Window verwendet werden.

Mozilla Systemfarben Erweiterungen

-moz-ButtonDefault: Rahmenfarbe, die um Schaltflächen angezeigt wird, die die Standardaktion für Dialoge darstellen.
-moz-ButtonHoverFace: Hintergrundfarbe einer Schaltfläche, über der der Mauszeiger steht (was ThreeDFace oder ButtonFace wäre, wenn der Mauszeiger nicht darübersteht). Sollte mit der Vordergrundfarbe -moz-ButtonHoverText verwendet werden.
-moz-ButtonHoverText: Textfarbe einer Schaltfläche, über der der Mauszeiger steht (was ButtonText wäre, wenn der Mauszeiger nicht darübersteht). Sollte mit der Hintergrundfarbe -moz-ButtonHoverFace verwendet werden.
-moz-CellHighlight: Hintergrundfarbe für markierte Elemente in einem Baum. Sollte mit der Vordergrundfarbe -moz-CellHighlightText verwendet werden. Siehe auch -moz-html-CellHighlight.
-moz-CellHighlightText: Textfarbe für markierte Elemente in einem Baum. Sollte mit der Hintergrundfarbe -moz-CellHighlight verwendet werden. Siehe auch -moz-html-CellHighlightText.
-moz-Combobox: Hintergrundfarbe für Combo-Boxen. Sollte mit der Vordergrundfarbe -moz-ComboboxText verwendet werden. In Gecko Versionen vor 1.9.2 sollte stattdessen -moz-Field verwendet werden.
-moz-ComboboxText: Textfarbe für Combo-Boxen. Sollte mit der Hintergrundfarbe -moz-Combobox verwendet werden. In Gecko Versionen vor 1.9.2 sollte stattdessen -moz-FieldText verwendet werden.
-moz-Dialog: Hintergrundfarbe für Dialoge. Sollte mit der Vordergrundfarbe -moz-DialogText verwendet werden.
-moz-DialogText: Textfarbe für Dialoge. Sollte mit der Hintergrundfarbe -moz-Dialog verwendet werden.
-moz-dragtargetzone
-moz-EvenTreeRow: Hintergrundfarbe für geradzahlige Zeilen in einem Baum. Sollte mit der Vordergrundfarbe -moz-FieldText verwendet werden. In Gecko Versionen vor 1.9 sollte stattdessen -moz-Field verwendet werden. Siehe auch -moz-OddTreeRow.
-moz-Field: Hintergrundfarbe für Texteingabefelder. Sollte mit der Vordergrundfarbe -moz-FieldText verwendet werden.
-moz-FieldText: Textfarbe für Texteingabefelder. Sollte mit der Hintergrundfarbe -moz-Field, -moz-EvenTreeRow oder -moz-OddTreeRow verwendet werden.
-moz-html-CellHighlight: Hintergrundfarbe für markierte Elemente in HTML <select>s. Sollte mit der Vordergrundfarbe -moz-html-CellHighlightText verwendet werden. In Gecko Versionen vor 1.9 sollte stattdessen -moz-CellHighlight verwendet werden.
-moz-html-CellHighlightText: Vordergrundfarbe für markierte Elemente in HTML <select>s. Sollte mit der Hintergrundfarbe -moz-html-CellHighlight verwendet werden. In Gecko Versionen vor 1.9 sollte stattdessen -moz-CellHighlightText verwendet werden.
-moz-mac-accentdarkestshadow
-moz-mac-accentdarkshadow
-moz-mac-accentface
-moz-mac-accentlightesthighlight
-moz-mac-accentlightshadow
-moz-mac-accentregularhighlight
-moz-mac-accentregularshadow
-moz-mac-chrome-active
-moz-mac-chrome-inactive
-moz-mac-focusring
-moz-mac-menuselect
-moz-mac-menushadow
-moz-mac-menutextselect
-moz-MenuHover: Hintergrundfarbe für Menüeinträge, über denen der Mauszeiger steht. Oft ähnlich zu Highlight. Sollte mit der Vordergrundfarbe -moz-MenuHoverText oder -moz-MenuBarHoverText verwendet werden.
-moz-MenuHoverText: Textfarbe für Menüeinträge, über denen der Mauszeiger steht. Oft ähnlich zu HighlightText. Sollte mit der Hintergrundfarbe -moz-MenuHover verwendet werden.
-moz-MenuBarText: Vordergrundfarbe für Text in Menüleisten. Oft ähnlich zu MenuText. Sollte auf einem Menu Hintergrund verwendet werden.
-moz-MenuBarHoverText: Vordergrundfarbe für Text in Menüleisten, über dem der Mauszeiger steht. Oft ähnlich zu -moz-MenuHoverText. Sollte auf einem -moz-MenuHover Hintergrund verwendet werden.
-moz-nativehyperlinktext: Standardplattformfarbe für Hyperlinks.
-moz-OddTreeRow: Hintergrundfarbe für ungeradzahlige Zeilen in einem Baum. Sollte mit der Vordergrundfarbe -moz-FieldText verwendet werden. In Gecko Versionen vor 1.9 sollte stattdessen -moz-Field verwendet werden. Siehe auch -moz-EvenTreeRow.
-moz-win-communicationstext: Sollte für Text in Objekten mit -moz-appearance: -moz-win-communications-toolbox; verwendet werden.
-moz-win-mediatext: Sollte für Text in Objekten mit -moz-appearance: -moz-win-media-toolbox; verwendet werden.

Mozilla Farbpräferenz Erweiterungen

-moz-activehyperlinktext: Benutzerpräferenz für die Textfarbe aktiver Links. Sollte mit dem Standarddokumenthintergrund verwendet werden.

-moz-default-background-color: Benutzerpräferenz für die Dokumenthintergrundfarbe.

-moz-default-color: Benutzerpräferenz für die Textfarbe.
-moz-hyperlinktext: Benutzerpräferenz für die Textfarbe nicht besuchter Links. Sollte mit dem Standarddokumenthintergrund verwendet werden.
-moz-visitedhyperlinktext: Benutzerpräferenz für die Textfarbe besuchter Links. Sollte mit dem Standarddokumenthintergrund verwendet werden.

Spezifikationen

Spezifikation	Status	Kommentar
CSS Color Module Level 4	Bearbeiterentwurf	`rebeccapurple` hinzugefügt.
CSS Color Module Level 3	Empfehlung	Systemfarben als veraltet markiert; SVG-Farben hinzugefügt; functionale Notationen `rgba()`, `hsl()` und `hsla()` hinzugefügt.
CSS Level 2 (Revision 1)	Empfehlung	`orange` als Farbe und Systemfarben hinzugefügt.
CSS Level 1	Empfehlung	Ursprüngliche Definition

Merkmal	Chrome	Firefox (Gecko)	Internet Explorer	Opera	Safari (WebKit)
Schlüsselwortfarben	1.0	1.0 (1.0)	3.0 ^[1]	3.5	1.0 (85)
`#RRGGBB` \| `#RGB`	1.0	1.0 (1.0)	3.0	3.5	1.0 (85)
`rgb()`	1.0	1.0 (1.0)	4.0	3.5	1.0 (85)
`hsl()`	1.0	1.0 (1.5)	9.0	9.5	3.1 (525)
`rgba()`	1.0	3.0 (1.9)	9.0	10.0	3.1 (525)
`hsla()`	1.0	3.0 (1.9)	9.0	10.0	3.1 (525)
`currentColor`	1.0	1.5 (1.8)	9.0	9.5	4.0 (528)
`transparent`	1.0	3.0 (1.9)	9.0 ^[2]	10.0	3.1 (525)
`rebeccapurple`	38.0	33 (33)	11	25.0	7.1

Merkmal	Android	Firefox Mobile (Gecko)	IE Phone	Opera Mobile	Safari Mobile
Grundlegende Unterstützung	?	?	?	?	?
`rgba()`	?	?	?	?	(Ja)
`rebeccapurple`	(Ja)	33.0 (33)	?	?	8

[1] Die 'e'-grau Farben (mit einem e im Namen) (grey, darkgrey, darkslategrey, dimgrey, lightgrey, lightslategrey) werden nur seit IE 8.0 unterstützt. IE 3 bis IE 6 unterstützen nur die 'a'-Varianten: gray, darkgray, darkslategray, dimgray, lightgray, lightslategray.

[2] IE 7-8 unterstützt das Schlüsselwort transparent nur für background und border. color: transparent; wird in IE schwarz dargestellt. IE 6 rendert transparente Rahmen ebenfalls schwarz.

Siehe auch

Die opacity Eigenschaft, die es erlaubt, die Transparenz einer Farbe auf Elementebene zu definieren.
Die color, background-color, border-color, outline-color, text-shadow und box-shadow Eigenschaften.