Was ist ein Hex-Farbcode, und wie liest man #2F6FED?

Eine Designerin, ein Styleguide oder die Einstellungen einer Website haben Ihnen etwas wie #2F6FED gegeben. Vorne ein Rautezeichen, dann sechs gemischte Buchstaben und Ziffern, und heraus kommt eine Farbe. Dieser Text erklärt, was diese sechs Zeichen aussagen.

Das Lesenkönnen hat einen handfesten Nutzen: Legen Sie zwei Codes nebeneinander, erkennen Sie ohne Farbmuster, welcher dunkler ist und welcher stärker ins Blaue geht. Und Sie können eine Farbe von Hand ein Stück heller oder dunkler stellen.

Warum eine Farbe mit Zahlen beschrieben wird

Jeder Punkt auf Ihrem Bildschirm besteht aus drei winzigen Lichtern: Rot, Grün und Blau. Indem man ihre Stärke einzeln einstellt, entstehen Millionen Farben. "Dunkelblau" versteht jeder etwas anders – nennt man aber die Stärke der drei Lichter als Zahlen, erzeugt jeder Bildschirm dieselbe Farbe.

Ein Hex-Code presst diese drei Zahlen in eine einzige Schreibweise. Das Rautezeichen am Anfang kündigt nur an, dass ein Farbcode folgt; es trägt selbst keinen Wert. Die sechs Zeichen danach zerfallen in drei Paare, und jedes Paar gibt die Stärke eines Lichts an, der Reihe nach: Rot, Grün, Blau.

Das heißt: #2F6FED ist kein Name, sondern eine Anweisung – dreh das Rot so weit auf, das Grün so weit, das Blau so weit. Deshalb bedeutet derselbe Code in jedem Programm und auf jedem Bildschirm dieselbe Farbe.

#2F6FED Stelle für Stelle

Zerlegen Sie den Code in drei Teile: 2F, 6F und ED. Jeder Teil steht für eine Stärke zwischen 0 und 255, wobei 0 heißt, dass dieses Licht ganz aus ist, und 255, dass es voll aufgedreht ist.

In der anderen gebräuchlichen Schreibweise lautet dieselbe Farbe rgb(47, 111, 237) – dieselbe Anweisung in anderem Gewand. Rot ist niedrig, Grün mittel, Blau fast am Anschlag: Heraus kommt ein kräftiges Blau. So beurteilt man einen Code auch auf einen Blick, nämlich danach, welches Paar am größten ist.

Warum die Buchstaben? Zählen in Sechzehnerschritten

Im Alltag zählen wir mit zehn Ziffern: von 0 bis 9, dann rücken wir eine Stelle weiter. Hex-Codes zählen mit sechzehn Zeichen; nach der 9 rücken sie nicht weiter, sondern machen mit A weiter. A bedeutet also zehn, B elf, C zwölf, D dreizehn, E vierzehn und F fünfzehn.

Das erste Zeichen eines Paares zählt Sechzehner, das zweite Einer. Nehmen wir ED auseinander: E ist vierzehn, und vierzehn Sechzehner ergeben 224; zählt man die 13 hinzu, für die D steht, kommt man auf 237. Von Hand rechnen müssen Sie das nie – fügen Sie den Code in den Farbcode-Umrechner ein, und alle drei Kanäle stehen fertig da.

Der kleinste Wert eines Paares ist 00, der größte FF; dazwischen liegen 256 Stufen. Die folgende Tabelle liest ein paar vertraute Farben nach derselben Logik.

Dreistellige Codes und achtstellige Transparenz

Gelegentlich begegnen Ihnen dreistellige Codes wie #F00. Das ist eine Kurzschreibweise, in der sich jedes Zeichen verdoppelt, #F00 ist also tatsächlich #FF0000. Nach derselben Regel bedeutet #2F6 den Wert #22FF66 – das ist eine völlig andere Farbe als #2F6FED und keine Abkürzung davon.

Achtstellige Codes hängen ein weiteres Paar an, und dieses Paar legt fest, wie durchsichtig die Farbe ist: 00 ist völlig unsichtbar, FF völlig deckend. Ein Wert dazwischen lässt den Untergrund teilweise durchscheinen.

Groß- oder Kleinschreibung ändert nichts; #2f6fed und #2F6FED sind dieselbe Farbe. Manche Programme wollen das Rautezeichen gar nicht, andere setzen es selbst davor.

Wie finde ich den Code einer Farbe, die ich sehe?

Der häufigste Fall ist der, dass Sie den Code eben nicht haben: Die gewünschte Farbe steckt in einem Foto, einem Logo oder irgendwo auf dem Bildschirm. Der Weg führt nicht über das Schätzen mit dem Auge, sondern über das Auslesen aus einem Bild.

Steht die Farbe auf dem Bildschirm, machen Sie zuerst eine Bildschirmaufnahme. Unter Windows halten Sie dafür die Windows-Taste zusammen mit Umschalt und S und ziehen einen Ausschnitt auf; auf dem Mac nehmen Sie Befehlstaste, Umschalt und 4. Auf dem Handy landet die Aufnahme direkt in der Galerie. Sobald Sie ein Bild haben, geben Sie es in das Werkzeug, das die Farbpalette aus einem Bild ausliest: Die vorherrschenden Farben erscheinen als Kacheln samt Hex-Code.

Eine Einschränkung: Eine Fläche in einem Foto hat nie einen einzigen Wert, Licht und Schatten verschieben ihn. Das Werkzeug liefert einen Mittelwert, der die Fläche vertritt. Suchen Sie eine ganz bestimmte Stelle, schneiden Sie das Bild vorher darauf zu – das Ergebnis wird deutlich genauer.

Der Code steht – und jetzt?

Eine einzelne Farbe reicht selten. Die dunklere Fassung, die eine Schaltfläche unter dem Mauszeiger annimmt, der blasse Hintergrund einer Karte, die zurückgenommene Linie eines Rahmens – sie alle gehören zur selben Familie. Der Generator für Farbtöne und Farbpaletten baut aus einem einzigen Code eine gleichmäßig abgestufte Leiter von hell nach dunkel, damit Sie die Zwischenschritte nicht raten müssen.

Der zweite Schritt ist die Lesbarkeit, und darüber entscheidet nicht das Auge. Der Unterschied zwischen Schrift- und Hintergrundfarbe wird als eine einzige Zahl gemessen; die Richtlinien WCAG verlangen für normal große Schrift mindestens 4,5:1 und für große Überschriften mindestens 3:1. In Deutschland stützt sich auch die Barrierefreie-Informationstechnik-Verordnung auf diese Richtlinien. Das Werkzeug zur Kontrastprüfung sagt Ihnen, ob Ihr Farbpaar diese Schwellen erreicht.

Der dritte Schritt ist die Übersetzung zwischen den Schreibweisen. An einer Stelle wird Hex verlangt, an der nächsten RGB, an der dritten HSL; der Farbcode-Umrechner liefert alle drei zugleich. Zu HSL greifen Sie, wenn Sie hellere oder dunklere Geschwister einer Farbe von Hand ableiten wollen, denn die Helligkeit ist dort ein Wert, den Sie schlicht hoch- oder herunterdrehen.

Häufige Fragen

Was ist ein Hex-Farbcode?

Eine sechsstellige Schreibweise, die den Rot-, Grün- und Blauanteil einer Farbe im Sechzehnersystem angibt. Nach dem Rautezeichen stehen zuerst zwei Zeichen für Rot, dann zwei für Grün, dann zwei für Blau; jedes Paar entspricht einer Stärke zwischen 0 und 255.

Wie finde ich den Hex-Code einer Farbe in einem Bild?

Geben Sie das Bild in das Werkzeug zur Farbpalette; die vorherrschenden Farben kommen als Kacheln mit Hex-Code zurück. Steht die Farbe auf dem Bildschirm statt in einer Datei, machen Sie zuerst eine Bildschirmaufnahme. Ein Zuschnitt auf die gesuchte Stelle macht das Ergebnis deutlich genauer.

Sind #2F6 und #2F6FED dieselbe Farbe?

Nein. In der dreistelligen Kurzschreibweise verdoppelt sich jedes Zeichen, #2F6 bedeutet also #22FF66. Die Kurzform funktioniert nur bei Codes, deren Paare ohnehin gleich sind: #F00 ist wirklich #FF0000.

Groß- oder Kleinschreibung – was ist richtig?

Beides. #2f6fed und #2F6FED beschreiben dieselbe Farbe. Innerhalb eines Dokuments einheitlich zu bleiben macht es lediglich leichter zu lesen.

Woran erkenne ich, ob meine Farbe als Schrift lesbar ist?

Messen Sie den Kontrast zwischen Schrift- und Hintergrundfarbe. Das Werkzeug zur Kontrastprüfung fasst ihn in einer Zahl zusammen und sagt, ob die von WCAG geforderten 4,5:1 für normale Schrift erreicht sind. Das Auge täuscht hier; schon die Bildschirmhelligkeit verschiebt das Urteil.

Zuletzt aktualisiert: 27. August 2026