- HTML-Farbcodes
-
Webfarben sind Farben, die für die Gestaltung von Webseiten eingesetzt werden.
Webautoren haben zwei Möglichkeiten, die Farben einzelner Elemente auf ihren Webseiten festzulegen. Farben können zum einen als RGB-Werte im Hexadezimalformat definiert werden. Zum anderen gibt es die benannten Farben, welche einen englischen Namen besitzen.
Inhaltsverzeichnis
Hexadezimalformat
Im Hexadezimalformat werden Farben durch eine sechstellige Hexadezimal-Zahl mit vorangestelltem #-Zeichen dargestellt. Dabei bezeichnen je zwei Ziffern die Intensität der drei Farbkanäle Rot, Grün und Blau in dieser Reihenfolge. So bezeichnet #FF0000 Rot, #00FF00 Grün und #0000FF Blau (FF in Hexadezimal entspricht 255 in Dezimal-Schreibweise). Alle anderen Farben lassen sich durch Mischung dieser drei Farben darstellen (siehe RGB-Farbraum, für Beispiele siehe unten).
Darüber hinaus gibt es auch ein kurzes Hexadezimalformat, bei dem jeder Farbkanal nur durch eine Stelle dargestellt wird. Hellrot (#FF9999) kann somit auch als #F99 dargestellt werden und ein Gelbgrün #AAFF33 als #AF3.
Standardisierte Farbnamen
Es gibt mehrere Standards, die Farbnamen Hexadezimal-Codes zuordnen.
HTML 4/VGA
HTML 4: die 16 Farben des VGA-16-Farben-Standards black #000000 silver #C0C0C0 maroon #800000 red #FF0000 green #008000 lime #00FF00 olive #808000 yellow #FFFF00 navy #000080 blue #0000FF purple #800080 fuchsia #FF00FF teal #008080 aqua #00FFFF gray #808080 white #FFFFFF Die dunklen Farben ergeben sich durch eine (nahezu) Halbierung des Rot-, Grün- und Blauwerts von 0xFF auf 0x80 (Ausnahme: schwarz und silber).
CSS 3
Die CSS-3-Spezifikation des W3C definiert aus der Liste des X11, die für das |SVG 1.0 standardisiert wurde, folgende 140 Farben:
Nach Sättigung und Farbton Maroon #800000 DarkRed #8B0000 FireBrick #B22222 Red #FF0000 Salmon #FA8072 Tomato #FF6347 Coral #FF7F50 OrangeRed #FF4500 Chocolate #D2691E SandyBrown #F4A460 DarkOrange #FF8C00 Orange #FFA500 DarkGoldenrod #B8860B Goldenrod #DAA520 Gold #FFD700 Olive #808000 Yellow #FFFF00 YellowGreen #9ACD32 GreenYellow #ADFF2F Chartreuse #7FFF00 LawnGreen #7CFC00 Green #008000 Lime #00FF00 LimeGreen #32CD32 SpringGreen #00FF7F MediumSpringGreen #00FA9A Turquoise #40E0D0 LightSeaGreen #20B2AA MediumTurquoise #48D1CC Teal #008080 DarkCyan #008B8B Aqua #00FFFF Cyan #00FFFF DarkTurquoise #00CED1 DeepSkyBlue #00BFFF DodgerBlue #1E90FF RoyalBlue #4169E1 Navy #000080 DarkBlue #00008B MediumBlue #0000CD Blue #0000FF BlueViolet #8A2BE2 DarkOrchid #9932CC DarkViolet #9400D3 Purple #800080 DarkMagenta #8B008B Fuchsia #FF00FF Magenta #FF00FF MediumVioletRed #C71585 DeepPink #FF1493 HotPink #FF69B4 Crimson #DC143C Brown #A52A2A IndianRed #CD5C5C RosyBrown #BC8F8F LightCoral #F08080 Snow #FFFAFA MistyRose #FFE4E1 DarkSalmon #E9967A LightSalmon #FFA07A Sienna #A0522D SeaShell #FFF5EE SaddleBrown #8B4513 Peachpuff #FFDAB9 Peru #CD853F Linen #FAF0E6 Bisque #FFE4C4 Burlywood #DEB887 Tan #D2B48C AntiqueWhite #FAEBD7 NavajoWhite #FFDEAD BlanchedAlmond #FFEBCD PapayaWhip #FFEFD5 Moccasin #FFE4B5 Wheat #F5DEB3 Oldlace #FDF5E6 FloralWhite #FFFAF0 Cornsilk #FFF8DC Khaki #F0E68C LemonChiffon #FFFACD PaleGoldenrod #EEE8AA DarkKhaki #BDB76B Beige #F5F5DC LightGoldenrodYellow #FAFAD2 LightYellow #FFFFE0 Ivory #FFFFF0 OliveDrab #6B8E23 DarkOliveGreen #556B2F DarkSeaGreen #8FBC8F DarkGreen #006400 ForestGreen #228B22 LightGreen #90EE90 PaleGreen #98FB98 Honeydew #F0FFF0 SeaGreen #2E8B57 MediumSeaGreen #3CB371 Mintcream #F5FFFA MediumAquamarine #66CDAA Aquamarine #7FFFD4 DarkSlateGray #2F4F4F PaleTurquoise #AFEEEE LightCyan #E0FFFF Azure #F0FFFF CadetBlue #5F9EA0 PowderBlue #B0E0E6 LightBlue #ADD8E6 SkyBlue #87CEEB LightskyBlue #87CEFA SteelBlue #4682B4 AliceBlue #F0F8FF SlateGray #708090 LightSlateGray #778899 LightsteelBlue #B0C4DE CornflowerBlue #6495ED Lavender #E6E6FA GhostWhite #F8F8FF MidnightBlue #191970 SlateBlue #6A5ACD DarkSlateBlue #483D8B MediumSlateBlue #7B68EE MediumPurple #9370DB Indigo #4B0082 MediumOrchid #BA55D3 Plum #DDA0DD Violet #EE82EE Thistle #D8BFD8 Orchid #DA70D6 LavenderBlush #FFF0F5 PaleVioletRed #DB7093 Pink #FFC0CB LightPink #FFB6C1 Black #000000 DimGray #696969 Gray #808080 DarkGray #A9A9A9 Silver #C0C0C0 LightGrey #D3D3D3 Gainsboro #DCDCDC WhiteSmoke #F5F5F5 White #FFFFFF Nach Helligkeit (CIE) Black #000000 Navy #000080 DarkBlue #00008B MediumBlue #0000CD MidnightBlue #191970 Indigo #4B0082 Blue #0000FF Maroon #800000 DarkRed #8B0000 Purple #800080 DarkMagenta #8B008B DarkViolet #9400D3 SaddleBrown #8B4513 DarkSlateBlue #483D8B DarkGreen #006400 DarkSlateGray #2F4F4F Brown #A52A2A FireBrick #B22222 Sienna #A0522D BlueViolet #8A2BE2 DarkOliveGreen #556B2F Green #008000 Crimson #DC143C MediumVioletRed #C71585 Red #FF0000 DarkOrchid #9932CC Teal #008080 DimGray #696969 Chocolate #D2691E Fuchsia #FF00FF Magenta #FF00FF SlateBlue #6A5ACD Olive #808000 IndianRed #CD5C5C DarkCyan #008B8B OrangeRed #FF4500 RoyalBlue #4169E1 ForestGreen #228B22 MediumOrchid #BA55D3 DeepPink #FF1493 DarkGoldenrod #B8860B SeaGreen #2E8B57 OliveDrab #6B8E23 MediumSlateBlue #7B68EE Tomato #FF6347 PaleVioletRed #DB7093 Gray #808080 SlateGray #708090 Peru #CD853F DodgerBlue #1E90FF DarkOrange #FF8C00 MediumPurple #9370DB SteelBlue #4682B4 Coral #FF7F50 LightSlateGray #778899 Orchid #DA70D6 Salmon #FA8072 LightCoral #F08080 HotPink #FF69B4 RosyBrown #BC8F8F Orange #FFA500 Goldenrod #DAA520 CadetBlue #5F9EA0 LightSeaGreen #20B2AA DarkSalmon #E9967A DeepSkyBlue #00BFFF Violet #EE82EE CornflowerBlue #6495ED MediumSeaGreen #3CB371 SandyBrown #F4A460 DarkTurquoise #00CED1 LightSalmon #FFA07A LimeGreen #32CD32 DarkGray #A9A9A9 DarkKhaki #BDB76B Plum #DDA0DD Tan #D2B48C DarkSeaGreen #8FBC8F YellowGreen #9ACD32 BurlyWood #DEB887 Gold #FFD700 MediumAquamarine #66CDAA LightPink #FFB6C1 Silver #C0C0C0 Lime #00FF00 MediumTurquoise #48D1CC MediumSpringGreen #00FA9A Thistle #D8BFD8 SpringGreen #00FF7F LightSteelBlue #B0C4DE Pink #FFC0CB Turquoise #40E0D0 Aqua #00FFFF Cyan #00FFFF LawnGreen #7CFC00 SkyBlue #87CEEB Chartreuse #7FFF00 LightSkyBlue #87CEFA LightGrey #D3D3D3 LightBlue #ADD8E6 LightGreen #90EE90 GreenYellow #ADFF2F PeachPuff #FFDAB9 Yellow #FFFF00 Khaki #F0E68C Wheat #F5DEB3 NavajoWhite #FFDEAD Gainsboro #DCDCDC PowderBlue #B0E0E6 PaleGoldenrod #EEE8AA Moccasin #FFE4B5 Bisque #FFE4C4 PaleGreen #98FB98 MistyRose #FFE4E1 PaleTurquoise #AFEEEE BlanchedAlmond #FFEBCD Lavender #E6E6FA AntiqueWhite #FAEBD7 Aquamarine #7FFFD4 PapayaWhip #FFEFD5 Linen #FAF0E6 Beige #F5F5DC LavenderBlush #FFF0F5 OldLace #FDF5E6 LemonChiffon #FFFACD LightGoldenrodYellow #FAFAD2 Cornsilk #FFF8DC Seashell #FFF5EE WhiteSmoke #F5F5F5 AliceBlue #F0F8FF FloralWhite #FFFAF0 GhostWhite #F8F8FF LightYellow #FFFFE0 Snow #FFFAFA Honeydew #F0FFF0 LightCyan #E0FFFF Ivory #FFFFF0 MintCream #F5FFFA Azure #F0FFFF White #FFFFFF Alphabetische Reihenfolge AliceBlue #F0F8FF AntiqueWhite #FAEBD7 Aqua #00FFFF Aquamarine #7FFFD4 Azure #F0FFFF Beige #F5F5DC Bisque #FFE4C4 Black #000000 BlanchedAlmond #FFEBCD Blue #0000FF BlueViolet #8A2BE2 Brown #A52A2A BurlyWood #DEB887 CadetBlue #5F9EA0 Chartreuse #7FFF00 Chocolate #D2691E Coral #FF7F50 CornflowerBlue #6495ED Cornsilk #FFF8DC Crimson #DC143C Cyan #00FFFF DarkBlue #00008B DarkCyan #008B8B DarkGoldenrod #B8860B DarkGray #A9A9A9 DarkGreen #006400 DarkKhaki #BDB76B DarkMagenta #8B008B DarkOliveGreen #556B2F DarkOrange #FF8C00 DarkOrchid #9932CC DarkRed #8B0000 DarkSalmon #E9967A DarkSeaGreen #8FBC8F DarkSlateBlue #483D8B DarkSlateGray #2F4F4F DarkTurquoise #00CED1 DarkViolet #9400D3 DeepPink #FF1493 DeepSkyBlue #00BFFF DimGray #696969 DodgerBlue #1E90FF FireBrick #B22222 FloralWhite #FFFAF0 ForestGreen #228B22 Fuchsia #FF00FF Gainsboro #DCDCDC GhostWhite #F8F8FF Gold #FFD700 Goldenrod #DAA520 Gray #808080 Green #008000 GreenYellow #ADFF2F Honeydew #F0FFF0 HotPink #FF69B4 IndianRed #CD5C5C Indigo #4B0082 Ivory #FFFFF0 Khaki #F0E68C Lavender #E6E6FA LavenderBlush #FFF0F5 LawnGreen #7CFC00 LemonChiffon #FFFACD LightBlue #ADD8E6 LightCoral #F08080 LightCyan #E0FFFF LightGoldenrodYellow #FAFAD2 LightGreen #90EE90 LightGrey #D3D3D3 LightPink #FFB6C1 LightSalmon #FFA07A LightSeaGreen #20B2AA LightSkyBlue #87CEFA LightSlateGray #778899 LightSteelBlue #B0C4DE LightYellow #FFFFE0 Lime #00FF00 LimeGreen #32CD32 Linen #FAF0E6 Magenta #FF00FF Maroon #800000 MediumAquamarine #66CDAA MediumBlue #0000CD MediumOrchid #BA55D3 MediumPurple #9370DB MediumSeaGreen #3CB371 MediumSlateBlue #7B68EE MediumSpringGreen #00FA9A MediumTurquoise #48D1CC MediumVioletRed #C71585 MidnightBlue #191970 MintCream #F5FFFA MistyRose #FFE4E1 Moccasin #FFE4B5 NavajoWhite #FFDEAD Navy #000080 OldLace #FDF5E6 Olive #808000 OliveDrab #6B8E23 Orange #FFA500 OrangeRed #FF4500 Orchid #DA70D6 PaleGoldenrod #EEE8AA PaleGreen #98FB98 PaleTurquoise #AFEEEE PaleVioletRed #DB7093 PapayaWhip #FFEFD5 PeachPuff #FFDAB9 Peru #CD853F Pink #FFC0CB Plum #DDA0DD PowderBlue #B0E0E6 Purple #800080 Red #FF0000 RosyBrown #BC8F8F RoyalBlue #4169E1 SaddleBrown #8B4513 Salmon #FA8072 SandyBrown #F4A460 SeaGreen #2E8B57 Seashell #FFF5EE Sienna #A0522D Silver #C0C0C0 SkyBlue #87CEEB SlateBlue #6A5ACD SlateGray #708090 Snow #FFFAFA SpringGreen #00FF7F SteelBlue #4682B4 Tan #D2B48C Teal #008080 Thistle #D8BFD8 Tomato #FF6347 Turquoise #40E0D0 Violet #EE82EE Wheat #F5DEB3 White #FFFFFF WhiteSmoke #F5F5F5 Yellow #FFFF00 YellowGreen #9ACD32 Hierbei kann statt der Silbe gray auch grey geschrieben werden. Ferner sind aqua und cyan sowie magenta und fuchsia die gleiche Farbe. Die Liste setzt sich im Wesentlichen aus den 120 Farben des Netscape-Browsers und den 16 VGA-Farben zusammen. Nur die Farben Bisque (#FFE4C4) und BlanchedAlmond (#FFEBCD) stammen nicht daher.
Herstellerabhängige Farbnamen
Zusätzlich haben die Hersteller von Browsern eine Vielzahl von Farbnamen definiert. Bei diesen ist aber nicht sichergestellt, dass alle Browser diese Farbnamen auch interpretieren können. Um browserunabhängiges HTML zu erzeugen, sollte man diese Farbnamen nicht verwenden.
Websichere Farben
Eine andere Gruppe von Farben wird allgemein als Websichere Farbpalette bezeichnet. Als die Palette der websicheren Farben entwickelt wurde, konnten Computer oft nur 256 verschiedene Farben anzeigen. Es wurde eine Palette von Farben benötigt, die nicht von der Grafik durch Dithering angenähert werden musste. Betriebssysteme belegen für ihren eigenen Gebrauch etwa 16 bis 20 Farben, die nicht benutzt werden können, es bleiben also zirka 236 frei wählbare Farben. Eine weitere Überlegung war, für jede Grundfarbe (Rot, Grün, und Blau) sechs verschiedene Farbtöne anbieten zu können, also 6 · 6 · 6 = 63 = 216 Farben. Die Palette wurde zuerst durch Lynda Weinman vorgeschlagen. Standardmäßig umgesetzt wurde sie zuerst von Netscape, wobei die restlichen 40 von 256 Farben frei definierbar waren. Die websicheren Farben haben keine Namen, werden also durch die Angaben ihrer RGB-Werte im RGB-Farbraum festgelegt.
Tabelle der 216 Websicheren Farben #000 #003 #006 #009 #00C #00F #030 #033 #036 #039 #03C #03F #300 #303 #306 #309 #30C #30F #330 #333 #336 #339 #33C #33F #600 #603 #606 #609 #60C #60F #630 #633 #636 #639 #63C #63F #900 #903 #906 #909 #90C #90F #930 #933 #936 #939 #93C #93F #C00 #C03 #C06 #C09 #C0C #C0F #C30 #C33 #C36 #C39 #C3C #C3F #F00 #F03 #F06 #F09 #F0C #F0F #F30 #F33 #F36 #F39 #F3C #F3F #060 #063 #066 #069 #06C #06F #090 #093 #096 #099 #09C #09F #360 #363 #366 #369 #36C #36F #390 #393 #396 #399 #39C #39F #660 #663 #666 #669 #66C #66F #690 #693 #696 #699 #69C #69F #960 #963 #966 #969 #96C #96F #990 #993 #996 #999 #99C #99F #C60 #C63 #C66 #C69 #C6C #C6F #C90 #C93 #C96 #C99 #C9C #C9F #F60 #F63 #F66 #F69 #F6C #F6F #F90 #F93 #F96 #F99 #F9C #F9F #0C0 #0C3 #0C6 #0C9 #0CC #0CF #0F0 #0F3 #0F6 #0F9 #0FC #0FF #3C0 #3C3 #3C6 #3C9 #3CC #3CF #3F0 #3F3 #3F6 #3F9 #3FC #3FF #6C0 #6C3 #6C6 #6C9 #6CC #6CF #6F0 #6F3 #6F6 #6F9 #6FC #6FF #9C0 #9C3 #9C6 #9C9 #9CC #9CF #9F0 #9F3 #9F6 #9F9 #9FC #9FF #CC0 #CC3 #CC6 #CC9 #CCC #CCF #CF0 #CF3 #CF6 #CF9 #CFC #CFF #FC0 #FC3 #FC6 #FC9 #FCC #FCF #FF0 #FF3 #FF6 #FF9 #FFC #FFF Wirklich websichere Farben
Designer werden oft noch dazu angehalten, die 216 websicheren Farben in ihren Webseiten zu verwenden. Die websicheren Farben wurden aber zu einer Zeit (ca. 1995) entwickelt, als Grafikkarten und Monitore mit 8 Bit Farbtiefe der übliche Standard waren.
Bei der Verwendung von 16 Bit Farbtiefe ergeben sich weitere Probleme: David Lehn und Hadley Stern haben festgestellt, dass nur 22 der 216 websicheren Farben bei 16 Bit Farbtiefe ohne Neuberechnung richtig dargestellt werden können. Sie bezeichneten diese Gruppe von 22 Farben als wirklich websichere Farbpalette. Sie besteht hauptsächlich aus grünen und gelben Farbtönen, ihre Werte sind in der folgenden Tabelle dargestellt:
000 F00 003 F03 00F F0F 0F0 6F0 FF0 3F3 6F3 FF3 0F6 3F6 CF6 FF6 0FC 3FC 0FF 3FF 6FF FFF Durch die Verbreitung von Grafikkarten und Monitoren, die 24 Bit oder mehr Farbtiefe darstellen können, ist die Palette der websicheren Farben bedeutungslos geworden.
Siehe auch
Weblinks
- Eine Farbtabelle sortiert nach Schattierungen
- HTML Color Spectrum Chart
- Farbnamen des W3C
- Web Color Reference
- „the browser-safe web-palette“, ein Abgesang auf die websicheren Farben von einer ihrer Protagonistinnen: Lynda Weinmann
- „VisiBone’s ‚Web-Safe‘ Color Lab“, beschreibt eine intuitivere Anordnung der websicheren Farben
- Hexcodes der Webfarben
- FarbFinder Ein JavaScript-Programm zum direkten einfärben einer HTML-Seite. Die Tabellen sind der natürlichen Wahrnehmung entsprechend dreidimensional sortiert.
- Webfarben Hexcodes Dynamische Tabelle der Webfarben und Farbe Pickerwerkzeug
- Zusammenpassende Farb-Schemata – sehr nützlich zur Auswahl passender Schattierungen
- http://www.metacolor.de Sehr gutes und umfangreiches Tutorial über Farben im Webdesign
- A3W Multimedia – Webcolors, verschiedene Ansichten und Farbrechner
- RGB ↔ HEX Umrechner mit Farbanzeige
Die in diesem Artikel verwendeten Farben werden auf jedem Monitor anders dargestellt und sind nicht farbverbindlich. Eine Möglichkeit, die Darstellung mit rein visuellen Mitteln näherungsweise zu kalibrieren, bietet das nebenstehende Testbild: Tritt auf einer oder mehreren der drei grauen Flächen ein Buchstabe (R für Rot, G für Grün oder B für Blau) stark hervor, sollte die Gammakorrektur des korrespondierenden Monitor-Farbkanals korrigiert werden. Das Bild ist auf einen Gammawert von 2,2 eingestellt – den gebräuchlichen Wert für IBM-kompatible PCs. Apple-Macintosh-Rechner hingegen verwenden standardmäßig einen Gammawert von 1,8.
Wikimedia Foundation.
