Was sind HEX und RGBA Farbcodes?

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.

#0080ff

HEX-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.

• W3Schools Farbkonverter
• W3Schools Farbwähler