Hexadezimal-Code

Was ist HEX?

Der Begriff HEX steht für Hexadezimal (ein Zahlensystem zur Basis 16). In der Mediengestaltung ist ein HEX-Code eine sechstellige Kombination aus Zahlen und Buchstaben, die mit einer Raute (#) beginnt. Er definiert die Anteile der Grundfarben Rot, Grün und Blau (RGB) in einem digitalen Bild oder einer Website.

Ein HEX-Code ist immer nach dem gleichen Prinzip aufgebaut: #RRGGBB.

  • Die ersten zwei Stellen stehen für Rot.

  • Die mittleren zwei Stellen für Grün.

  • Die letzten zwei Stellen für Blau.

Beispiel: #FF0000 ist ein reines Rot, während #000000 Schwarz und #FFFFFF Weiß darstellt.

Die Mathematik hinter den Werten

Das Hexadezimalsystem nutzt 16 statt der üblichen 10 Ziffern. Da wir nach der 9 keine zweistelligen Zahlen (wie 10, 11, 12…) in einer einzigen Stelle unterbringen können, nutzt man Buchstaben:

0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F.

Dabei steht 0 für „gar kein Licht“ und F für den Maximalwert (15). Da jede Farbe im HEX-Code aus zwei Stellen besteht (z. B. „FF“ für Rot), ergeben sich pro Farbkanal 16 x 16 = 256 Abstufungen (von 0 bis 255).

  • #000000: Alle Kanäle auf Null – Schwarz.

  • #FFFFFF: Alle Kanäle auf Maximum – Weiß.

  • #FF0000: Rot auf Maximum, Grün und Blau aus – reines Rot.

Um den RGB-Wert zu erhalten, multipliziert man die jeweils erste Stelle mit 16 und addiert die zweite.
Ein Beispiel mit der Zahl „A5“:

Im Hexadezimalsystem ist A = 10.
Rechnung: 10 x 16 + 5 = 165.
Der RGB-Wert für diesen Kanal wäre also 165.

So funktioniert der Maximalwert „FF“:

Im Hexadezimalsystem ist F = 15.
Rechnung: 15 x 16 + 15 = 240 + 15 = 255.
Der RGB-Wert ist 255 – das Maximum.

Auf diese Weise ist es möglich, mit nur sechs Zeichen über 16,7 Millionen Farben zu definieren ($256 \times 256 \times 256$).

Warum wir HEX-Codes verwenden

HEX-Codes sind das Bindeglied zwischen Design und technischer Umsetzung. Wir nutzen sie aus drei wesentlichen Gründen:

  1. Eindeutigkeit: Statt „ein helles Blau“ zu definieren, nutzen wir einen Code wie #009FE3. Das stellt sicher, dass jeder Web-Entwickler weltweit genau denselben Farbton verwendet.

  2. Web-Standard: HEX ist die Standard-Sprache für CSS und HTML. Wenn wir ein Layout von Adobe InDesign für digitale Kanäle adaptieren, übersetzen wir die Farbewerte in HEX, damit die Anzeige im Browser konsistent bleibt.

  3. Kompaktheit: Der Code ist kurz, präzise und für Software extrem schnell lesbar, was die Effizienz im Workflow steigert.

HEX im Vergleich zu Print-Farben

Es ist wichtig zu verstehen, dass HEX-Werte auf dem RGB-Modell basieren (Lichtfarben). Wenn wir ein Projekt vorbereiten, das sowohl online als auch gedruckt werden soll, müssen wir die Farben sorgfältig abgleichen:

  • Online: Wir nutzen den HEX-Code für die maximale Leuchtkraft auf Bildschirmen.

  • Print: Für den Druck auf dem Rohbogen wandeln wir diese Werte in CMYK oder HKS um. Da Bildschirme leuchten und Papier Licht nur reflektiert, begleiten wir diesen Umwandlungsprozess fachmännisch, damit die visuelle Wirkung Ihres Corporate Designs über alle Medien hinweg erhalten bleibt.

Benötigen Sie Unterstützung? Lassen Sie uns sprechen.