Farben im Webdesign Die Anfänge
"The Sixteen Named Colors", die VGA Farbpalette und 16 Grundfarben - das Web wird bunt!
Diese Farben konnten sowohl von jedem VGA-kompatiblen Bildschirm als auch vom Netscape und Internet Explorer Browser gleich dargestellt werden. Dank dieser Spezifikation wurde jedem Nutzer, egal welchen Browser er nutzte, das gleiche Rot, Blau, Gelb oder Grün dargestellt. Diese 16 Farben sind waren sozusagen die Grundsteinlegung für das farbenfrohe Internet von heute.
Die HTML 3.2 Spezifikationen legte neben der Angabe des Farbnamens im HTML-Attribut, auch die Farbdefinition per Angabe der Hexadezimalzahl fest. Da sich alle Farben als Farbmischung aus den Grundfarben Rot, Grün und Blau ergeben. Die Farbangabe besteht aus einer Hexadezimalzahl mit sechs Ziffern der Form #rrggbb (z.B. COLORS="#000000). Die Farbwerte reichen von #000000 (Weiß) bis #FFFFFF (Schwarz).
Dies ist alles schon lange her, inzwischen gibt es HTML 4.01, plus CSS und viele viele Farben, manche sprechen von 16.777.216 Millionen.
Diese kleine Liste, mit den "The Sixteen Named Colors" war der erste Schritt für das schöne bunte Internetwelt wie wir sie heute erleben.
Neben diesen 16 "Named Colors" gibt es die namenlosen 216 websicheren Farben die für jede der Grundfarben (RGB, Rot, Grün, und Blau) sechs verschiedene Farbtöne definieren.
Die Tabelle unten zeigt die 16 Farben des VGA Standards, mit ihrem Namen, Hexadezimalcode, RGB Dezimal-Code, RGB Prozent sowie den HSL (Farbton, Sättigung und Helligkeit) und CMYK Werten.
Hex Code |
Farbname |
HSL Wert * |
RGB Wert (dezimal) |
RGB Wert (Prozent) |
CMYK Code |
|---|---|---|---|---|---|
| * HSL wird nicht von allen Browsern unterstützt; CMYK wird nicht in HTML + CSS eingesetzt, sondern im Druckbereich | |||||
| #00FFFF |
aqua |
hsl(180,100%,50%) |
rgb(0,255,255) |
rgb(0%,100%,100%) |
cmyk(100%, 0%, 0%, 0%) |
| #000000 |
black |
hsl(0,0%,0%) |
rgb(0,0,0) |
rgb(0%,0%,0%) |
cmyk(0%, 0%, 0%, 100%) |
| #0000FF |
blue |
hsl(240,100%,50%) |
rgb(0,0,255) |
rgb(0%,0%,100%) |
cmyk(100%, 100%, 0%, 0%) |
| #FF00FF |
fuchsia |
hsl(300,100%,50%) |
rgb(255,0,255) |
rgb(100%,0%,100%) |
cmyk(0%, 100%, 0%, 0%) |
| #808080 |
gray |
hsl(0,0%,50%) |
rgb(128,128,128) |
rgb(50%,50%,50%) |
cmyk(0%, 0%, 0%, 50%) |
| #008000 |
green |
hsl(120,100%,25%) |
rgb(0,128,0) |
rgb(0%,50%,0%) |
cmyk(100%, 0%, 100%, 50%) |
| #00FF00 |
lime |
hsl(120,100%,50%) |
rgb(0,255,0) |
rgb(0%,100%,0%) |
cmyk(100%, 0%, 100%, 0%) |
| #800000 |
maroon |
hsl(0,100%,25%) |
rgb(128,0,0) |
rgb(50%,0%,0%) |
cmyk(0%, 100%, 100%, 50%) |
| #000080 |
navy |
hsl(240,100%,25%) |
rgb(0,0,128) |
rgb(0%,0%,50%) |
cmyk(100%, 100%, 0%, 50%) |
| #808000 |
olive |
hsl(60,100%,25%) |
rgb(128,128,0) |
rgb(50%,50%,0%) |
cmyk(0%, 0%, 100%, 50%) |
| #800080 |
purple |
hsl(300,100%,25%) |
rgb(128,0,128) |
rgb(50%,0%,50%) |
cmyk(0%, 100%, 0%, 50%) |
| #FF0000 |
red |
hsl(0,100%,50%) |
rgb(255,0,0) |
rgb(100%,0%,0%) |
cmyk(0%, 100%, 100%, 0%) |
| #C0C0C0 |
silver |
hsl(0,0%,75%) |
rgb(192,192,192) |
rgb(75%,75%,75%) |
cmyk(0%, 0%, 0%, 25%) |
| #008080 |
teal |
hsl(180,100%,25%) |
rgb(0,128,128) |
rgb(0%,50%,50%) |
cmyk(100%, 0%, 0%, 50%) |
| #FFFFFF |
white |
hsl(0,0%,100%) |
rgb(255,255,255) |
rgb(100%,100%,100%) |
cmyk(0%, 0%, 0%, 0%) |
| #FFFF00 |
yellow |
hsl(60,100%,50%) |
rgb(255,255,0) |
rgb(100%,100%,0%) |
cmyk(0%, 0%, 100%, 0%) |
Weitere Themen in der Rubrik Webdesign
- Sicher ist sicher - die 216 websicheren Farben
- Farben fürs Web definieren. RGB, HSL, RGBA oder HSLA, per HTML und CSS ergeben
- Basic's aus der Farbtheorie - eigene Farbpaletten erstellen
- RGBA, HSLA und CSS opacity - gibt Farben Transparenz
- Das Web wird bunt! The Sixteen Named Colors, - die VGA Farbpalette und 16 Grundfarben
- Farben im Webdesign - Das Farbspektrum mit Hex-Codes
- Farbpaletten von eigenen Bildern
Pflanzzeiten 2024
Sep./Okt.
24.09. 20:00 Uhr bis 09.10. 13:00 Uhr
Okt./Nov.
22.10. 04:00 Uhr bis 05.11. 17:00 Uhr
*****
Gründüngung
Tipps aus der Paxis
*****
Serie über Urpflanzen
Algen und Flechten
Die mutigen Landgänger
*****
Moose
die harten Arbeiter, die ständig neuen Lebensraum schaffen
*****
Chlorophyll
Der Stoff aus dem das Leben ist
*****