Farbsysteme und Farbmodelle
Farben spielen im Design eine besondere Rolle. Sie transportieren Emotionen und helfen eine ganze Marke zu identifizieren. Für unsere eigene Marke MarkOp Webdesign entschieden wir uns für die Auszeichnungsfarbe Petrol, doch Petrol ist nicht gleich Petrol. Es gibt nicht nur zahlreiche Petroltöne, sie werden auch über verschiedene Medien unterschiedlich wiedergegeben. Wie also kannst du gewährleisten, dass die Hausfarben deiner eigenen Marke überall identisch erscheinen, Konsumierende diese erkennen und eine Verbindung zu deiner Brand herstellen?
Die Lösung sind Farbmodelle – auch Farbsysteme genannt – für die digitale und analoge Ausgabe und spezielle Farbkataloge. In diesem Beitrag stellen wir die wichtigsten Werkzeuge für die Wiedergabe von Farben über Bildschirme und auf Printprodukten vor. Du erfährst außerdem, was der Unterschied zwischen den Farbmodellen RGB und CMYK ist und wann du dich mit Sonderfarben aus Farbkatalogen wie Pantone oder HKS beschäftigen solltest.
Digitale Farbmodelle
Das RGB-Farbsystem
Beginnen wir mit dem Farbsystem unseres Spezialgebietes Websites. Die digitale Farbwiedergabe erfolgt im RGB-Modell. Im Gegensatz zu gedruckten Farben, ist eine digitale Anzeige aus einer Vielzahl von kleinen Leuchtstoffen aufgebaut, die je einen R-, G- oder B-Wert wiedergeben. Aus dieser Mischung ergibt sich durch den Abstand zum Bildschirm die finale Farbe. Das Ergebnis ist ein selbstleuchtender, strahlender Farbraum mit hohem Kontrastumfang.
Hinweis: Womöglich hast du diese RGB-Streifen selbst schon gesehen. Auf älteren Fernsehgeräten sind sie aus extremer Nähe gut zu erkennen – obwohl wir natürlich nicht empfehlen, so nah vor dem Fernseher zu sitzen 😉
Eine Farbe wird im RGB-Farbsystem mit ihren Rot-, Grün- und Blau-Werten angegeben, welche jeweils zwischen 0 und 255 liegen. Dabei steht 255 für den vollen Lichtanteil einer Komponente und 0 für ihre Nicht-Existenz. Werden alle drei Grundfarben vollkommen angezeigt (jeweils 255), ergibt sich ein weißes Licht. Wird keine Grundfarbe angezeigt (jeweils 0), ergibt sich daraus Schwarz, da kein Licht vorhanden ist.
Ein Whitepaper und die enthaltenen Grafiken für unseren Kunden Shopify Plus erstellten wir von Beginn an im RGB-Farbraum.
Farbangaben im Web
Die genauen RGB-Werte einer Farbe benötigst du auf Webseiten vor allem für Elemente wie Hintergründe, Buttons oder Text. Um bestimmte Farben zu erhalten, kannst du diese:
direkt benennen (z. B. yellow oder blue),
im Dezimalcode angeben (z. B. rgb(223,209,42)),
oder
als Hex-Code einfügen (z. B. #dfd12a).
Inzwischen hat sich die Nutzung des Hex-Codes als Standard etabliert. Die Zeichenfolgen können besser übertragen werden und vereinfachen den Quellcode deiner Website. Eine Farbkennung besteht aus sieben Zeichen, mit einem ‚#‘ beginnend, gefolgt von einem Mix aus sechs Ziffern und Buchstaben. Je ein Zeichenpaar steht für einen R-, G- oder B-Wert, übertragen in das Hexadezimalsystem (#rrggbb).
Auf der Website unserer Kundin With Love From Cooking Mom wird ein Goldton als Akzent durch die sanften beigen RGB-Farben hervorgehoben.
Schauen wir uns als Beispiel einmal die Farbwerte unserer Kundin With Love From Cooking Mom an. Der Markenauftritt zeichnet sich durch einen starken Goldton als Akzentfarbe aus, während mit viel Weißraum und hellen Beigetönen gearbeitet wird. Das WLFCM-Gold wird im Dezimalsystem wie folgt angegeben: R = 214 G = 168 B = 85, woraus sich ein Hex-Code von # d6a855 ergibt. Diesen können wir nutzen, um sowohl auf der Website verschiedene Elemente einzufärben als auch bei der Erstellung von Grafiken über Photoshop und Co.
Analoge Farbmodelle
Das CMYK-Farbsystem
Natürlich braucht man für einen gelungenen Markenauftritt nicht nur digitale Medien, sondern nutzt auch das ein oder andere analoge Produkt, um sich nach außen zu präsentieren. Das richtige Farbsystem im Druck ist CMYK, also die Mischung von Cyan (C), Magenta (M), Gelb (Y) und Schwarz (K), wobei Schwarz als Kontrastgeber und für den Druck von reinem Schwarz dient. Wie im RGB-Farbsystem, werden auch hier die Farbkomponenten anteilig aufgetragen, woraus sich die finale Farbe ergibt. Die vier Komponenten können jeweils einen Wert zwischen 0 % und 100 % annehmen.
Während im RGB-Farbsystem durch das Fehlen jeglicher Farbwerte, also das Fehlen von Licht, Schwarz entsteht, ergibt sich im CMYK-Farbensystem beim Fehlen von Farbe ein transparenter Bereich. Dieser wird standardmäßig als Weiß angegeben, wie beim Druck auf weißes Papier. CMYK-Farben bestehen immer aus vier Komponenten, da selbst bei einem vollen Anteil von C, M und Y kein Schwarz, sondern lediglich ein sehr dunkles Braun entsteht. Erst durch die Zugabe des vierten Wertes K kann reines Schwarz gedruckt werden.
Für das Printmagazin ORO•MAG nutzten wir das CMYK-Farbsystem. Das Magazin wurde im Offsetdruck produziert.
Hinweis: Betrachte deine Grafiken vor einem wichtigen Druck nicht nur digital, sondern auch in einem Probedruck (Proof). Optimalerweise kannst du dafür bereits den finalen Bedruckstoff nutzen, um Abweichungen deiner CMYK-Farben vom gewünschten Ergebnis direkt zu erkennen und auszugleichen.
Sonderfarben und Farbkataloge
Obwohl mit dem CMYK-Farbsystem eine Vielzahl an Farben wiedergegeben werden kann, so liegen doch Sonderfarben wie leuchtende Neon- oder glänzende Gold- und Silbertöne außerhalb des Möglichen. Für diese Sonderfarben wird im Druck zwischen Prozessfarben und Volltonfarben unterschieden. Als Prozessfarben werden dabei Farben bezeichnet, die erst während des Drucks aus den vier Komponenten CMYK entstehen. Volltonfarben hingegen werden bereits vor dem Druck angemischt und als eigene Farbquelle in die Druckmaschine eingebunden.
Hinweis: Die Farbe Weiß zählt ebenfalls als Sonderfarbe, da sie beim Druck auf einem bunten Medium als eigene Farbe gedruckt werden muss. Geschieht dies nicht, erscheint an Stellen, die im ursprünglichen Design weiß (transparent) angezeigt wurden, die Farbe des bedruckten Mediums.
Volltonfarben werden zum einen genutzt, um Farben zu drucken, die sich durch den anteiligen Druck im CMYK-Modell nicht erstellen lassen. Andererseits stellen diese besonderen Farben eine Möglichkeit dar, den Wiedererkennungswert einer Marke zu steigern. In den national und international gültigen Farbkatalogen HKS, RAL und Pantone können Farben anhand einer Kodierung genau zugeordnet werden. Entscheidet man sich als Unternehmen für eine (oder mehrere) dieser festgelegten Farben als Markenfarbe, kann diese weltweit und auf nahezu allen Untergründen einheitlich dargestellt und identifiziert werden.
Das Petrol unserer Webdesign-Unit entspricht der Pantone-Farbe 323 C und das Orange der Pantone-Farbe 137 C.
Besonders relevant für die Druck- und Designbranche hierzulande sind die beiden Farbkataloge HKS und Pantone. Während HKS der Farbstandard im deutschsprachigen Raum ist, hat sich Pantone international etabliert. Beide Sammlungen stellen ihre Sonderfarben sowohl auf unbeschichtetem (z. B. Office-Papier) und glänzend beschichtetem Grund (z. B. Papier von Zeitschriften) dar.
Hinweis: Der HKS- bzw. Pantone-Wert der eigenen Markenfarbe lässt sich zwar digital aus den CMYK- oder RGB-Werten heraus ermitteln, allerdings ist es immer von Vorteil, sofern man sich für den Einsatz einer Volltonfarbe entscheidet, diese im Original gedruckt zu betrachten. Die digitale Anzeige von Farben ist stark abhängig von der Kalibrierung eines Bildschirms.
Warum brauchen wir überhaupt verschiedene Farbsysteme?
Je nachdem worüber eine Farbe wiedergegeben wird, entsteht sie auf unterschiedliche Weise. Bei einer digitalen Darstellung mit RGB werden Farben additiv gemischt. Eine bestimmte Farbe entsteht hierbei durch Hinzufügen immer neuer Farbreize. Vereinfacht kannst du es dir wie unterschiedliche farbige Folien vor einem Fenster vorstellen, die übereinandergelegt werden.
Im Gegensatz dazu erfolgt die Mischung von CMYK-Farben bei Drucksachen subtraktiv. Die Farbwirkung auf den Menschen entsteht dadurch, dass Licht auf eine Fläche fällt und diese nur bestimmte Lichtstrahlen reflektiert. Das reflektierte Licht wird vom Menschen als Farbe wahrgenommen. Beispielsweise werden bei einer roten Fläche nur rote Lichtstrahlen reflektiert, wodurch die Fläche als “rot” identifiziert wird.
Additive Farbmischung (RGB)
Subtraktive Farbmischung (CMYK)
Ob analoge oder digitale Wiedergabe, in beiden Fällen werden verschiedene Grundfarben jeweils anteilig eingebracht und ergeben die finale Farbe. Da verschiedene Farbmodelle unterschiedliche Farben wiedergeben, ist es wichtig den Zweck des finalen Mediums zu kennen. Willst du eine Grafik erstellen, die hauptsächlich in Druckprodukten erscheint, solltest du sie von vornherein im CMYK-Farbraum anlegen. Die Umwandlung in ein anderes Farbsystem ist auch nachträglich möglich, kann aber zu gewissen Farbabweichungen führen. Beispielsweise strahlen Farben im RGB-Farbraum merklich, während CMYK-Farben gesetzter wahrgenommen werden.
Hinweis: Egal, in welchem Farbraum du eine Datei erstellt hast, prüfe vor der Ausgabe immer, ob das gewählte Farbsystem für den Verwendungszweck geeignet ist. Gib eine Grafik für eine Website unbedingt in RGB aus und eine Grafik für einen gedruckten Flyer in CMYK.
