HEX-Code in RGB-Werte umrechnen

Lesen Sie den Code paarweise und wandeln Sie jedes Paar vom Hexadezimal- ins Dezimalsystem um. Das erste Paar ist der Rotkanal, das zweite der Grünkanal, das dritte der Blaukanal, und jeder Wert liegt zwischen 0 und 255. Der Code #3B82F6 zerfällt in 3B, 82 und F6 und ergibt damit rgb(59, 130, 246).

Formel: R, G und B sind die aufeinanderfolgenden Zeichenpaare des Codes, gelesen als hexadezimale Zahlen.

Ein einzelnes Paar lässt sich auch im Kopf ausrechnen, denn es sind eine Multiplikation und eine Addition. Multiplizieren Sie das erste Zeichen mit 16 und addieren Sie das zweite, wobei A für 10, B für 11 und F für 15 steht. Für das Paar 3B ergibt das 3 × 16 + 11, also 59.

Einige Codes kommen häufiger vor als andere. Schwarz #000000 ist rgb(0, 0, 0), Weiß #FFFFFF ist rgb(255, 255, 255), und das Grau #808080 ist rgb(128, 128, 128) — genau die Hälfte jedes Kanals.

In die andere Richtung beruht die Rechnung auf derselben Zahl, mit einer Änderung: Sie teilen den Kanal durch 16 und schreiben den Rest als zweites Zeichen des Paares. Die ganze Umrechnung übernimmt der Umrechner RGB in HEX.

RGB beschreibt eine Farbe mit drei Zahlen: je eine für den roten, den grünen und den blauen Kanal, alle im Bereich von 0 bis 255. Ein Bildschirm baut die Farbe aus Licht auf, deshalb gilt: je höher die Zahlen, desto heller der Punkt, und drei Höchstwerte ergeben Weiß[1].

Ein HEX-Code beschreibt dieselbe Farbe kürzer. Ein Kanalwert passt im Hexadezimalsystem in genau zwei Zeichen, deshalb belegt die ganze Farbe sechs Zeichen nach dem Rautezeichen.

Im Alltag begegnen Ihnen die beiden Schreibweisen an unterschiedlichen Stellen. Den HEX-Code liefern Figma, das Farbfeld im Redaktionssystem und das Markenhandbuch, weil er kurz und leicht weiterzugeben ist. RGB-Werte kommen dort zum Einsatz, wo mit der Farbe gerechnet wird: bei Kontrastprüfungen nach WCAG, bei der Schreibweise mit Transparenz und in 3D-Engines.

Die Spezifikation CSS Color Level 4 erlaubt vier Codelängen: drei, vier, sechs oder acht Zeichen[2]. Die dreistellige Fassung ist eine Kurzschreibweise, bei der der Browser jedes Zeichen verdoppelt, sodass #123 dasselbe bedeutet wie #112233. Die vier- und die achtstellige Fassung ergänzen am Ende die Deckkraft, wobei 00 für vollständige Transparenz und FF für volle Deckung steht.

Beide Formen beschreiben die Farbe im sRGB-Farbraum. Hewlett-Packard und Microsoft schlugen den Standard 1996 vor, und das W3C übernahm ihn für HTML und CSS unter der Bezeichnung IEC 61966-2-1[3]. Deshalb ergibt derselbe Code auf jedem konformen Bildschirm dieselbe Farbe.

Schreiben Sie den Code in Zelle A1 und tragen Sie in drei Nachbarzellen die Formeln =HEXINDEZ(TEIL(A1;2;2)), =HEXINDEZ(TEIL(A1;4;2)) und =HEXINDEZ(TEIL(A1;6;2)) ein. Für den Code #3B82F6 geben sie 59, 130 und 246 zurück.

Die erste dieser Funktionen liest eine hexadezimale Zahl[4], die zweite schneidet die aufeinanderfolgenden Zeichenpaare aus dem Code heraus. TEIL erwartet die Zelle, die Position des ersten Zeichens und die Anzahl der Zeichen, und da der Code mit einem Rautezeichen beginnt, stehen die Kanäle an den Positionen 2, 4 und 6.

Kopieren Sie die drei Zellen nach unten, dann rechnet die Tabelle eine ganze Spalte von Codes um. In der englischen Programmfassung heißen die Funktionen HEX2DEC und MID, und die Argumente trennt ein Komma.