<hex-color>
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.
Der <hex-color>
CSS Datentyp ist eine Notation zur Beschreibung der hexadezimalen Farbsyntax einer sRGB-Farbe, die die primären Farbkomponenten (Rot, Grün, Blau) als hexadezimale Zahlen sowie deren Transparenz verwendet.
Ein <hex-color>
-Wert kann überall verwendet werden, wo ein <color>
verwendet werden kann.
Syntax
#RGB // The three-value syntax #RGBA // The four-value syntax #RRGGBB // The six-value syntax #RRGGBBAA // The eight-value syntax
Wert
R
oderRR
-
Die rote Komponente der Farbe als hexadezimale Zahl, die zwischen
0
undff
(255) liegt und nicht zwischen Groß- und Kleinschreibung unterscheidet. Wenn es nur eine Zahl gibt, wird sie verdoppelt:1
bedeutet11
. G
oderGG
-
Die grüne Komponente der Farbe als hexadezimale Zahl, die zwischen
0
undff
(255) liegt und nicht zwischen Groß- und Kleinschreibung unterscheidet. Wenn es nur eine Zahl gibt, wird sie verdoppelt:c
bedeutetcc
. B
oderBB
-
Die blaue Komponente der Farbe als hexadezimale Zahl, die zwischen
0
undff
(255) liegt und nicht zwischen Groß- und Kleinschreibung unterscheidet. Wenn es nur eine Zahl gibt, wird sie verdoppelt:9
bedeutet99
. A
oderAA
Optional-
Die Alpha-Komponente der Farbe, die die Transparenz angibt, als hexadezimale Zahl, die zwischen
0
undff
(255) liegt und nicht zwischen Groß- und Kleinschreibung unterscheidet. Wenn es nur eine Zahl gibt, wird sie verdoppelt:e
bedeutetee
.0
oder00
steht für eine vollständig transparente Farbe,f
oderff
für eine vollständig undurchsichtige.
Hinweis:
Die Syntax unterscheidet nicht zwischen Groß- und Kleinschreibung: #00ff00
ist dasselbe wie #00FF00
.
Beispiele
Hexadezimales Hot Pink
Dieses Beispiel zeigt vier Hot Pink Quadrate mit vollständig undurchsichtigen oder halbtransparenten Hintergründen, die mit vier verschiedenen fallunterscheidungsfreien hexadezimalen Farbsyntaxen erstellt wurden.
HTML
<div>
#F09
<div class="c1"></div>
</div>
<div>
#f09a
<div class="c2"></div>
</div>
<div>
#ff0099
<div class="c3"></div>
</div>
<div>
#FF0099AA
<div class="c4"></div>
</div>
CSS
Die Hot Pink Hintergrundfarben werden mit den drei-, vier-, sechs- und achtstelligen hexadezimalen Notationen erstellt, wobei sowohl Groß- als auch Kleinbuchstaben verwendet werden.
[class] {
width: 40px;
height: 40px;
}
.c1 {
background: #f09;
}
.c2 {
background: #f09a;
}
.c3 {
background: #ff0099;
}
.c4 {
background: #ff0099aa;
}
Ergebnis
Spezifikationen
Specification |
---|
CSS Color Module Level 4 # hex-notation |
Browser-Kompatibilität
Report problems with this compatibility data on GitHubdesktop | mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
RGB hexadecimal notation ( #RRGGBB , #RGB , …) | ||||||||||||
RGBA hexadecimal notation ( #RRGGBBAA , #RGBA ) |
Legend
Tip: you can click/tap on a cell for more information.
- Full support
- Full support
Siehe auch
<color>
Datentyp<named-color>
Datentyprgb()
Farb-Funktion- CSS-Farben Modul