Pipette

Grauwerte

In diesem Artikel möchten wir uns dem Thema "Grauwerte" widmen. Dazu schauen wir uns zunächst an, welche Eigenarten und welche Form Grauwerte in den verschiedenen gängigen Farbmodellen haben beziehungsweise annehmen können. Anschließend stellen wir in einer Tabelle eine Serie unterschiedlicher Grauwerte von Schwarz bis Weiß gegenüber, deren Grauwert in immer gleichen Schritten abgestuft wurde. Anhand dieser Tabelle lassen sich die Erläuterungen zu den Farbmodellen leicht nachvollziehen. Zuletzt schauen wir abschließend auf gebräuchliche Begriffe, die für die verschiedenen Graunuancen in verschiedenen Kontexten verwendet werden.

Dieser Artikel ist in die folgenden Abschnitte eingeteilt:

Grauwerte im RGB-Farbmodell

Einen Grauwert erhalten wir innerhalb des RGB-Farbmodells immer dann, wenn die Anteile von Rot (R), Grün (G) und Blau (B) identisch sind. Ist jeder dieser Anteile 0, ergibt sich schwarz (in hexadezimaler Schreibweise #000 oder #000000). Falls dagegen alle Anteile auf 100 Prozent stehen, ergibt sich weiß (in hexadezimaler Schreibweise #FFF oder #FFFFFF beziehungsweise 255 in dezimaler Schreibweise). Dazwischen liegen gleichmäßig abgestuft alle Grauwerte.

Grauwerte im CMY-Farbmodell

Im CMY-Farbmodell verhält es sich ähnlich wie mit dem RGB-Farbmodell. Auch hier entsteht ein Grauwert bei exakt den gleichen Anteilen der Komponenten Cyan (C), Magenta (M) und Yellow (Y, Gelb). Regulieren lässt sich der Hellwert beziehungsweise Grauwert auch in diesem Modell durch eine konstante Variation dieser drei Werte.

Jedoch verhält es sich im subtraktiven CMY-Farbmodell umgekehrt zum additiven RGB-Farbmodell: Während im CMY-Farbmodell alle Komponenten für die Farbe schwarz auf 100 Prozent und für die Farbe weiß auf 0 Prozent stehen müssen, ist es im RGB-Farbmodell genau andersherum. Im RGB-Farbmodell ergibt sich weiß, wenn alle Komponenten auf 100 Prozent stehen und schwarz, wenn jede der 3 Komponenten auf 0 Prozent steht.

Grauwerte im CMYK-Farbmodell

Im CMYK-Modell erhält man einen Grauwert, indem man die Werte für Cyan (C), Magenta (M) und Yellow (Y, Gelb) beliebig konstant hält und den Grauwert über den Anteil von K (Key, Schwarz) reguliert. K kann dabei die Werte von 0 bis 100 Prozent annehmen. Da "K" für den Schwarzanteil steht, ergibt sich im CMYK-Farbmodell unter der Annahme, dass Cyan, Magenta und Yellow auf 0 Prozent stehen, automatisch, dass wir ein reines Schwarz mit einem K-Wert von 100 Prozent erhalten und die Farbe Weiß resultiert, wenn wir den K-Wert auf 0 Prozent setzen.

Wenn wir jedoch die Werte von Cyan, Magenta und Yellow auf 100 Prozent stellen, verhält es sich durch die subtraktive Farbmischung genau andersherum: Für diesen Fall erhalten wir ein reines Schwarz mit einem K-Wert von 0 Prozent und ein reines Weiß mit einem K-Wert von 100 Prozent. Falls Cyan, Magenta und Yellow einen identischen Wert haben, der zwischen 0 und 100 Prozent steht, erhalten wir durch die Variation des K-Wertes immer noch Grauwerte und ein reines Schwarz, jedoch kein reines Weiß mehr. Je höher die identischen Werte von Cyan, Magenta und Yellow sind, desto dunkler beginnt der Grauwert bei einem K-Wert von 0 Prozent. Stehen Cyan, Magenta und Yellow gar auf 100 Prozent, erhalten wir immer schwarz, unabhängig davon auf wie viel Prozent der K-Wert steht.

Grauwerte im HSV-Farbmodell

Im HSV-Farbmodell ergibt sich ein Grauwert durch eine Sättigung (S, Saturation) von 0 Prozent. Der gewählte Farbton (H, Hue) spielt dadurch keine Rolle mehr und die Helligkeit (V, Value) entscheidet darüber, wo das Grau zwischen Weiß und Schwarz anzusiedeln ist.

Das heißt, bei einer Sättigung von 0 Prozent können wir den Grauwert allein durch die Helligkeit regulieren. Bei einer Helligkeit von 0 Prozent erhalten wir schwarz, bei einer Helligkeit von 100 Prozent weiß, dazwischen liegen die Grauwerte. Der Farbton kann dabei einen beliebigen Wert annehmen ohne das Ergebnis zu verändern, da er durch die Sättigung von 0 Prozent vollständig abgedreht wurde. Typischerweise nutzt man für Schwarz, Weiß und Grauwerte jedoch keinen beliebigen H-Wert sondern einen Wert von 0 Prozent, da dies die Bedeutungslosigkeit dieses Wertes am besten widerspiegelt.

Grauwerte im XYZ / CIE-Normvalenzsystem

Gänzlich anders als in den bisher vorgestellten Farbmodellen verhält es sich im XYZ-Farbmodell beziehungsweise im von der internationalen Beleuchtungskommission entwickelten CIE-Normvalenzsystem. Dieses Modell versucht einerseits die Gesamtheit aller möglichen Farben darstellen zu können (was die anderen Modelle nicht können) und dabei andererseits die menschliche Wahrnehmung zu berücksichtigen.

Dazu definiert dieses System verschiedene Beobachter und Lichtverhältnisse, um möglichst vielen Situationen gerecht zu werden. Je nachdem welche Beleuchtung man wählt, fallen die aus der Umrechnung aus anderen Farbmodellen resultierenden Werte entsprechend unterschiedlich aus.

Einer der gebräuchlichsten und am häufigsten verwendeten Beleuchtungsarten ist die CIE-Normbeleuchtung D65 (mittleres Tageslicht), das zum Beispiel auch für sRGB, Adobe-RGB und die PAL/SECAM-TV-Norm genutzt wird. Unter dieser Beleuchtungsbedingung liegt das RGB-Weiß bei X = 95,047; Y = 100,000 sowie Z = 108,883 während das RGB-Schwarz bei X = 0; Y = 0 sowie Z = 0 liegt. Die dazwischenliegenden Grauwerte steigen zwar untereinander im gleichen Verhältnis an, folgen allerdings im Gegensatz zu allen bisher vorgestellten Farbmodellen wie RGB, CMY, CMYK oder HSV keiner exakten linearen Abstufung. So liegt das 50%-RGB-Grau zwar in allen anderen Systemen exakt auf der Hälfte der Skala, im XYZ-System unter D65-Bedingungen jedoch mit X = 20,518; Y = 21,586 und Z = 23,507 erst auf ungefähr 20 % der Skala. Der Grund dafür liegt darin, dass die Farben in dem XYZ-Farbraum nicht gleichmäßig verteilt sind. Nutzt man andere Beleuchtungsbedingungen, bleibt das RGB-Schwarz bei 0 während sich einfach nur das Maximum der Skala (auf der das RGB-Weiß liegt) ändert.

Bei Verwendung der normierten xyz-Variante Yxy (auch bekannt als xyY) unter der Bedingung mittleren Tageslichts (CIE-Normbeleuchtung D65) befindet sich die Farbe weiß beziehungsweise der Weißpunkt in der Mitte des CIE-xy Farbraums (in der Mitte der Normfarbtafel) an der Position mit den Koordinaten x = 0,313 und y = 0,328 mit einer Helligkeit von Y = 100 %. Auch alle Grauwerte inklusive schwarz befinden sich an diesem Punkt, jedoch mit einem Helligkeitswert Y von 0 % (schwarz) über die entsprechenden Grauschattierungen bis 100 % (weiß). Wählen wir eine andere Beleuchtungsart, würde sich der Weißpunkt an eine andere Stelle verschieben. So liegt der Weißpunkt der CIE-Normbeleuchtung D55 (direktes Sonnenlicht) beispielsweise bei x = 0,3324 und 0,3474 während die CIE-Normbeleuchtung E (Weißpunkt des energiegleichen Punktes) für beide Werte genau ein Drittel vorsieht.

Grauwerte im TColor-System

Der auf dem RGB-Farbmodell basierende TColor-Wert verrechnet die RGB-Anteile von Rot, Grün und Rot zu nur einer einzelnen Zahl (mehr zur Formel für die Berechnung im verlinkten Artikel). Damit ist das TColor-System das einzige aller hier vorgestellten Farbmodelle, das mit nur einem einzigen Wert zur vollständigen Beschreibung einer Farbe auskommt.

Bei dieser Verrechnung resultiert Schwarz in einem TColor-Wert von 0, Weiß ergibt den Wert 16777215. Dazwischen liegen im immer gleichen Abstand von 65793 die 254 verschiedenen ganzzahligen Graustufen aus dem RGB-Modell (256 Graustufen von schwarz über grau nach weiß). Jeder 65793te TColor-Wert ist damit ein Grauwert. Die Zahl 65793 resultiert dabei aus dem vollständigen Durchlaufen von zwei Farbkanälen (256 x 256 = 65536 Farben) plus 256 + 1 Farben des dritten Farbkanals.

Farbtabelle mit Grauwerten

Zur Demonstration dieser Eigenarten der verschiedenen Farbmodelle enthält die folgende Tabelle einige Grauwerte zwischen schwarz (oben) und weiß (unten) sowie die dazugehörigen Werte aus den unterschiedlichen Farbmodellen. Unter der Tabelle finden Sie eine Erklärung der einzelnen Spalten.

 HEX%RGBCMYCMYKHSVXYZXYZXYZTColor
 #0000000,000100,0100,00,000,000,000,000
 #0505051,96598,098,01,960,140,150,17328965
 #0A0A0A3,921096,196,13,920,290,300,33657930
 #0F0F0F5,881594,194,15,880,450,480,52986895
 #1414147,842092,292,27,840,670,700,761315860
 #1919199,802590,290,29,800,920,971,061644825
 #1E1E1E11,763088,288,211,81,231,301,411973790
 #23232313,733586,386,313,71,601,681,832302755
 #28282815,694084,384,315,72,022,122,312631720
 #2D2D2D17,654582,482,417,62,492,622,862960685
 #32323219,615080,480,419,63,033,193,473289650
 #37373721,575578,478,421,63,633,824,163618615
 #3C3C3C23,536076,576,523,54,294,524,923947580
 #41414125,496574,574,525,55,025,295,764276545
 #46464627,457072,572,527,55,826,126,674605510
 #4B4B4B29,417570,670,629,46,697,047,664934475
 #50505031,378068,668,631,47,628,028,745263440
 #55555533,338566,766,733,38,639,089,895592405
 #5A5A5A35,299064,764,735,39,7210,211,15921370
 #5F5F5F37,259562,762,737,310,911,412,56250335
 #64646439,2210060,860,839,212,112,713,96579300
 #69696941,1810558,858,841,213,414,115,46908265
 #6E6E6E43,1411056,956,943,114,815,617,07237230
 #73737345,1011554,954,945,116,317,118,77566195
 #78787847,0612052,952,947,117,918,820,57895160
 #7D7D7D49,0212551,051,049,019,520,522,38224125
 #82828250,9813049,049,051,021,222,324,38553090
 #87878752,9413547,147,152,923,024,226,48882055
 #8C8C8C54,9014045,145,154,924,926,228,69211020
 #91919156,8614543,143,156,926,928,330,89539985
 #96969658,8215041,241,258,829,030,533,29868950
 #9B9B9B60,7815539,239,260,831,232,835,710197915
 #A0A0A062,7516037,337,362,733,435,238,310526880
 #A5A5A564,7116535,335,364,735,837,641,010855845
 #AAAAAA66,6717033,333,366,738,240,243,811184810
 #AFAFAF68,6317531,431,468,640,742,946,711513775
 #B4B4B470,5918029,429,470,643,445,649,711842740
 #B9B9B972,5518527,527,572,546,148,552,812171705
 #BEBEBE74,5119025,525,574,548,951,556,112500670
 #C3C3C376,4719523,523,576,551,954,659,412829635
 #C8C8C878,4320021,621,678,454,957,862,913158600
 #CDCDCD80,3920519,619,680,458,061,066,513487565
 #D2D2D282,3521017,617,682,461,364,470,213816530
 #D7D7D784,3121515,715,784,364,668,074,014145495
 #DCDCDC86,2722013,713,786,368,071,677,914474460
 #E1E1E188,2422511,811,888,271,675,382,014803425
 #E6E6E690,202309,809,8090,275,279,186,215132390
 #EBEBEB92,162357,847,8492,279,083,190,515461355
 #F0F0F094,122405,885,8894,182,887,194,915790320
 #F5F5F596,082453,923,9296,186,891,399,416119285
 #FAFAFA98,042501,961,9698,090,995,6104,016448250
 #FFFFFF100,002550,000,00100,095,0100,0109,016777215

In der Tabelle sehen Sie in der ersten Spalte ein Farbfeld mit dem Grauwert der jeweiligen Tabellenzeile. Danach folgen die individuellen Werte der verschiedenen vorgestellten Farbmodelle:

Wenn Sie genauere Werte beziehungsweise Zwischennuancen dieser Grauwerte wünschen oder die Grauwerte weiterverarbeiten möchten, können Sie den Grauwert einfach über sein jeweiliges Farbfeld (erste Spalte der Tabelle) mit der Pipette aufnehmen und bearbeiten. Nehmen Sie die Farben einfach mit der Pipettenfunktion aus Ihrem Browserfenster auf, damit Sie die Werte nicht manuell eingeben müssen. Mit der Pipette lässt sich darüber hinaus auch die Wirkung der Variation der einzelnen Komponenten der verschiedenen Farbmodelle auf den Dunkel- beziehungsweise Helligkeitsgrad nachvollziehen, indem Sie in dem Programm den Anteil der einzelnen Komponenten an der Farbe schrittweise vergrößern oder verkleinern.

Die Tabelle wurde automatisch mit einer individuellen Softwarelösung von Stefan Trost Media generiert.

Bezeichnungen einzelner Grauwerte

Einige der vorgestellten Grauwerte lassen sich nicht nur über deren numerischen Zahlenwert in einem der verschiedenen Farbmodelle beschreiben, wie wir es im letzten Abschnitt gesehen haben, sondern zusätzlich auch über eigene Namen, die jedoch je nach Kontext auch voneinander abweichen können.

In der folgenden Tabelle sind einige dieser Bezeichnungen aus verschiedenen Kontexten gegenübergestellt. Die meisten dieser Farbnamen und Farbkonstanten stammen aus dem unter anderem auch für die Farbgebung von Webseiten verwendbaren X11 / SVG / CSS3 Color Modul, andere aus Programmiersprachen wie Java, Pascal (Delphi und Lararus) oder VBA (Visual Basic for Applications), aus dem Anwendungsframework und GUI-Toolkit Qt sowie aus der Text- und Dokument-Auszeichnungssprache LaTeX und dem von der Printer Working Group (PWG) entwickelten Standard PWG 5101.1 (Media Color Names).

In den ersten vier Spalten findet sich ein Farbfeld für den Grauwert, der hexadezimale Farbcode und der gerundete prozentuale Anteil aller Farbkanäle aus dem RGB-Farbmodell sowie eine deutsche Übersetzung des jeweiligen Namens. Danach folgen die individuellen Bezeichnungen aus den jeweiligen Kontexten. Falls ein Kontext keinen eigenen Namen für einen der gelisteten Farbwerte vorsieht, ist das entsprechende Feld mit einem Strich versehen.

 HEX%NameX11 / CSSJavaPascalQtVBALaTeXPWG
 #0000000SchwarzBlackBLACKclBlackblackvbBlackblackBlack
 #40404025Dunkelgrau-DARK_GRAYclDkGray--darkgrayDark Gray
 #69696941Trübgrau DimGray------
 #80808050GrauGray [CSS]GRAYclGraydarkGray-grayGray
 #A0A0A063Mediumgrau--clMedGraygray---
 #A9A9A966DunkelgrauDarkGray------
 #AFAFAF69Dunkelsilber------Dark Silver
 #BEBEBE74MittelgrauGray [X11]------
 #BFBFBF75Lichtgrau-----lightgray-
 #C0C0C075SilberSilverLIGHT_GRAYclSilver/clLtGraylightGray--Silver
 #D3D3D383HellgrauLightGray-----Light Gray
 #DCDCDC86GainsboroGainsboro------
 #E0E0E087Reinsilber------Clear Silver
 #E1E1E188Hellsilber------Light Silver
 #F5F5F596RauchfarbenWhiteSmoke------
 #FFFFFF100WeißWhiteWHITEclWhitewhitevbWhitewhiteWhite

Über alle Kontexte hinweg besteht der Konsens, die Bezeichnungen "schwarz" und "weiß" für die Farben mit den hexadezimalen RGB-Farbcodes #000000 (Farbanteil von Rot, Grün und Blau von 0 %) beziehungsweise #FFFFFF (Farbanteil von Rot, Grün und Blau von 100 %) zu verwenden. Aber auch der Begriff "grau" wird vergleichsweise einheitlich für einen RGB-Anteil von je 50 % auf allen Kanälen verwendet, was dem RGB-Farbcode #808080 entspricht.

Aber bereits bei den Begriffen "hellgrau" und "dunkelgrau" wird es deutlich uneindeutiger. Während die meisten Kontexte den RGB-Farbwert #404040 als dunkelgrau bezeichnen, definiert Qt den in den meisten anderen Kontexten als "grau" bezeichneten Farbwert #808080 als "dunkelgrau", während CSS diese Bezeichnung sogar für den Farbwert #A9A9A9 nutzt, der heller als das normale 50 % grau ist. Auch "hellgrau" kann je nach Kontext eine Farbe von #BFBFBF bis hin zu #D3D3D3 bedeuten. Wieso der CSS-Standard DarkGray (Dunkelgrau) heller als das normale Gray (Grau) definiert, erfahren Sie hier.

Weitere Begriffe für Grauschattierungen sind - gelistet nach deren Helligkeit von schwarz nach weiß - die Wörter "trübgrau" für #696969, "mediumgrau" für #A0A0A0, "dunkelsilber" für #AFAFAF, "lichtgrau" für #BFBFBF, "silber" für #C0C0C0, "gainsboro" für #DCDCDC, "reinsilber" für #E0E0E0, "hellsilber" für #E1E1E1 sowie "rauchfarben" für #F5F5F5. Die meisten dieser zusätzlichen Begriffe werden jedoch nur in einem oder in lediglich wenigen Kontexten genutzt. Am meisten Begriffe für Grauschattierungen definiert dabei der CSS-Standard sowie die Printer Working Group.

Die Uneindeutigkeit der Grauwertdefinitionen besteht nicht nur zwischen den verschiedenen Kontexten sondern auch innerhalb einiger Definitionsräume. So wird der Grauwert #C0C0C0 beispielsweise von Pascal gleich doppelt sowohl als "silber" (clSilver) als auch als "hellgrau" (clLtGray) bezeichnet. Gleich mehrere Mehrfachdefinitionen enthalten auch die Media Color Names der Printer Working Group (PWG). Geschuldet ist dies der Vorgehensweise dieser Farbschematik fast alle Farbwerte nicht nur in ihrer puren Variante zu definieren sondern zusätzlich auch in den Schattierungen "dark", "light" und "clear". Diese Abstufung führt in der Gruppe der farbwertlosen Grauwerte dazu, dass nicht nur "Gray" der Grauwert #808080 zugewiesen wurde sondern auch "Clear Black" und "Light Black" denselben Grauwert verkörpern. Das gleiche gilt für #C0C0C0 ("Silver" oder "Clear Gray") sowie #FFFFFF ("White" oder "Clear White").

Eine andere Form der Doppeldefintion beinhaltet der CSS-Standard: CSS akzeptiert nicht nur die amerikanische Schreibweise "Gray" mit "a" sondern auch die englische Schreibweise "Grey" mit "e". Die Wörter "Grey", "DimGrey", "DarkGrey" und "LightGrey" können demnach äquivalent zu "Gray", "DimGray", "DarkGray" und "LightGray" verwendet werden, auch wenn ältere Browser wie der Netscape Navigator noch auf die "a"-Variante bestanden haben.

Eine weitere und wiederum andere Art von Doppeldefinition betrifft die Farbkonstanten von Java: Die Programmiersprache Java ist normalerweise case-sensitive, so dass die Groß- und Kleinschreibung genau mit der Definition der Konstanten übereinstimmen muss. Die in der Tabelle gezeigten Farbkonstanten können jedoch neben der gezeigten großgeschriebenen Variante alternativ auch klein geschrieben werden. Zu dieser Besonderheit kam es, da die erste Definition dieser Konstanten in Kleinschreibung erfolgte. Da die Java-Konvention jedoch großgeschriebene Konstanten vorsieht, kam es zu einer entsprechenden Redefinition unter gleichzeitiger Beibehaltung der bereits definierten Varianten aus Kompatibilitätsgründen. Ansonsten gilt für die Schreibweise der Farbkonstanten und Farbnamen die in der jeweiligen Programmiersprache oder Umgebung übliche Herangehensweise, also zum Beispiel dass CSS, Pascal und VBA case-insensitive sind und entsprechend alle Schreibweisen erlauben und als gleichwertig ansehen während zum Beispiel LaTex und normalerweise auch Java case-sensitive sind und nur die gezeigten Schreibweisen akzeptieren.

Andere Farbtafeln

Hellwert und Sättigung | Hellwert | Sättigung | Grauwerte | Farbnamen | Webfarben