HEX und RGBA sind zwei Möglichkeiten, Farben in HTML und CSS zu definieren. Beide Schreibweisen beschreiben eine Farbe über ihre Rot-, Grün- und Blauwerte.
Was ist ein HEX-Farbcode?
Ein HEX-Farbcode besteht aus einer Raute und sechs Zeichen. Die Werte stehen für Rot, Grün und Blau.
#0080ffHEX-Codes sind kurz und werden häufig verwendet, wenn eine Farbe ohne Transparenz angegeben werden soll.
Was ist ein RGBA-Farbcode?
RGBA verwendet ebenfalls Rot, Grün und Blau. Zusätzlich kann mit dem vierten Wert die Deckkraft festgelegt werden.
rgba(0, 128, 255, 1)Der vierte Wert ist die Deckkraft:
- 1 bedeutet vollständig sichtbar.
- 0.5 bedeutet 50 % Deckkraft.
- 0 bedeutet vollständig transparent.
Beispiel
Der Farbcode #0080ff entspricht in RGBA:
rgba(0, 128, 255, 1)Dieselbe Farbe mit 50 % Deckkraft sieht so aus:
rgba(0, 128, 255, 0.5)Wann nutze ich HEX und wann RGBA?
- HEX: sinnvoll für normale Farben ohne Transparenz.
- RGBA: sinnvoll, wenn zusätzlich die Deckkraft gesteuert werden soll, zum Beispiel bei Hintergründen oder Overlays.
Farbcodes umrechnen
Es gibt verschiedene Online-Tools, mit denen Sie Farben auswählen oder HEX- und RGBA-Werte umrechnen können.