Helpful resources ▼
  Download   Pricing   Buy

HTML-Farbnamen – Verwendung in HTML

Farben spielen im Webdesign eine entscheidende Rolle, denn sie wecken Emotionen, vermitteln Botschaften und schaffen ein visuell ansprechendes Erlebnis. Im Bereich von HTML und CSS bieten Farbnamen eine bequeme Möglichkeit, Farben zu spezifizieren, ohne dass hexadezimale oder RGB-Werte erforderlich sind. Es gibt viele Möglichkeiten, wie Farben ihre Namen erhalten. Sie werden oft nach Pflanzen, Tieren oder anderen Dingen benannt, denen sie ähnlich sehen. So erhielt beispielsweise die Farbe Orange ihren Namen, als sie zur Beschreibung einer orangefarbenen Frucht verwendet wurde. Farben werden auch nach den Pigmenten benannt, die in der Vergangenheit zu ihrer Herstellung verwendet wurden, und der Name einer Farbe kann durch eine interessante Geschichte sowie durch Gefühle oder Emotionen, die mit dieser Farbe verbunden sind, beeinflusst werden.

Dieser Artikel erforscht die Welt der HTML-Farbnamen, ihre Verwendung, ihre Grenzen und die Bedeutung von Farben im Web-Design. Hier wird berechnet, wie viele Farben es nach dem RGB-Farbmodell gibt und wie viele Farben im HTML-Standard enthalten sind, wie die Namen einiger Farben entstanden sind und warum wir sie immer noch verwenden und nicht nur Farbcodes.

Wie viele Farben gibt es?

Die Anzahl der Farben in der Welt geht weit über die traditionellen Farben des Regenbogens hinaus. Wenn Sie sich das RGB-System ansehen, sehen Sie, dass es 256^3 = 16.777.216 Farben gibt, und sie können alle ihre eigenen Namen haben! Da es Millionen von Farben gibt, mussten die Menschen kreativ sein, um sie alle zu benennen. Obwohl die meisten Farben nur Schattierungen einer häufigeren Farbe sind, ist es immer interessant zu wissen, woher diese Namen kommen und was sie symbolisieren könnten.

HTML-Farbnamen

Die W3C-Spezifikation für Farbnamen unterscheidet zwischen Grundfarben und erweiterten Farben. HTML4 hat eine Farbnamenliste mit 140 Namen, darunter 16 Grundfarben – aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, und yellow. In HTML5 können Sie insgesamt 147 Farbnamen verwenden, darunter 17 Grundfarben. Der zusätzliche Grundfarbname in HTML5 ist orange.

Die Abbildung veranschaulicht 17 Grundfarben mit HEX-Codes:

Text “Farbnamenliste – 17 HTML-Grundfarben mit HEX-Codes”

Sie können Farben auf einer Website auch mit HTML-Farbcodes definieren – HEX, RGB, RGBA, HSL und HSLA. Weitere Informationen finden Sie in dem Artikel HTML-Farbcodes.

Ein bisschen Geschichte…

Woher kommen die HTML-Farbnamen? Farben waren ursprünglich ein Produkt des X Window Systems (X), einer grafischen Benutzeroberfläche (GUI), die vom Massachusetts Institute of Technology entwickelt wurde. Im Jahr 1986 umfasste die GUI-Farbliste in der Version X10R3 69 Grundtöne. Mit X11R2 kamen 1988 drei weitere Farben hinzu, darunter identische Grau- und Grautöne. Es heißt, dass die Programmierer von Hewlett-Packard sich nicht an die richtige Schreibweise erinnern konnten und beschlossen, zwei Schreibweisen zu verwenden, um Fehler zu vermeiden.

1989 kam ein wichtiges Update von Paul Raveling (X11R4) auf den Markt, das eine Vielzahl heller Neutraltöne wie “papaya whip” und “lemon chiffon” sowie andere hoch benannte Farbtöne wie “blanched almond” und “peach puff” enthielt. In den 80er Jahren konnten die Farben je nach Hersteller des Geräts von Monitor zu Monitor stark variieren. Nachdem er vom American National Standards Institute (ANSI), das Normen für die Farbeigenschaften von Webseiten herausgibt, keine Sanktionen erhalten hatte, beschloss Raveling, die Sache selbst in die Hand zu nehmen. Raveling entnahm diese Namen der inzwischen aufgelösten Farbenfirma Sinclair Paints und kalibrierte die Farben für seinen eigenen HP-Monitor.

X11 erhielt dann dank eines anderen Programmierers, John C. Thomas, eine Reihe kühnerer Farbnamen. Er änderte die Namen der Farbtöne, um die Verwirrung der Benutzer zu verringern. Angeblich half ihm dabei eine Schachtel mit 72 Crayola-Buntstiften. So entstanden “aquamarine”, “orchid”, und “salmon”, um nur einige zu nennen.

Im Jahr 2001 veröffentlichte das World Wide Web Consortium (W3C) den ersten Arbeitsentwurf des CSS 3-Farbmoduls, der Farben enthielt. Die Datenbank mit den Farbnamen war Gegenstand heftiger Diskussionen und harscher Kritik. Das Farbbenennungsschema wurde kritisiert. So war z. B. “dark grey” heller als “grey”; nicht alle Farben hatten eine dunkle oder helle Version, die Farbverteilung war ungleichmäßig und tendierte zu Rot und Grün und weg von Blau.

Weitere strittige Punkte waren sprachliche und kulturelle Fragen. Für viele, die nicht englische Muttersprachler waren, schienen einige der Farbnamen abstoßend zu sein; andere sahen in “indian red” eine mögliche rassistische Konnotation und hielten viele der Farbnamen für regional orientiert. Es ist anzumerken, dass diese Probleme auch heute noch relevant sind.

Die folgende Abbildung zeigt das RGB-Würfelmodell mit Farben, die Paul Raveling und John Thomas aufgenommen haben. Raveling fügte eine Gruppe von Off-White-Farbtönen hinzu, indem er Namen von Sinclair Paints verwendete. Thomas fügte kräftige Farbtöne hinzu, indem er Namen von Crayola übernahm:

Text “Verteilung der Farben von Raveling und Thomas im RGB-Würfel für eine Liste von HTML-Farbnamen”

Im Jahr 2014 erschien ein neuer Farbton in der Liste der HTML-Farbnamen. Das “Rebecca purple” wurde eingeführt zu Ehren von Rebecca Meyer, der Tochter von Eric Meyer, einem angesehenen Programmierer und CSS-Autor. Die Farbe (#663399) war die Lieblingsfarbe des Mädchens. Rebecca starb im Alter von sechs Jahren an Gehirnkrebs.

Text “RebeccaPurple Farbe mit HEX und RGB Codes”

Die Entwicklung der Farbnamen

Warum brauchen wir also HTML-Farbnamen? Wir können doch auch Farbcodes verwenden! Darauf gibt es viele Antworten, aber die wichtigste ist wohl, dass die Menschen Farbe nicht als eine Reihe von Zahlen und Buchstaben betrachten; die Verwendung eines Farbnamens für eine Person ist natürlicher. Die Geschichte der Farbnamen ist ein faszinierendes Thema, das viel über die Entwicklung von Sprache, Kultur und Technologie aussagt. Von den alten Ägyptern bis hin zu modernen Webdesignern haben die Menschen seit Tausenden von Jahren Farbnamen verwendet, um die Welt um sie herum zu beschreiben und zu definieren.

Farbnamen haben sich im Laufe der Zeit verändert, und was wir heute als eine bestimmte Farbe betrachten, war in der Vergangenheit möglicherweise nicht der Fall. Die Farbe, die wir heute als “orange” kennen, hieß in der Antike beispielsweise “yellow-red”. Und Purpur war einst eine Farbe, die den Königen vorbehalten war, da sie aus teuren Farbstoffen hergestellt wurde. Der Ursprung der Farbnamen geht auf das Altertum zurück, als die Menschen Farben oft nach Objekten der Natur oder kulturellen Phänomenen benannten. So wurde beispielsweise die Farbe “red” nach dem Sanskrit-Wort “raktam” benannt, das Blut bedeutet. Die Farbe “green” stammt von dem altenglischen Wort “grēne”, das ursprünglich “jung” oder “unreif” bedeutete und die Farbe junger Pflanzen und Blätter widerspiegelt.

Einige der beliebtesten Farbnamen sind heute HTML-Farbnamen, die zur Definition von Farben im Webdesign verwendet werden. Zu diesen Namen gehören Farben wie “cornflowerblue”, “lavender”, “lemonchiffon”, “papayawhip”, “palegoldenrod”, und “whitesmoke”. Designer verwenden Farbnamen, um bestimmte Emotionen und Stimmungen in ihren Arbeiten hervorzurufen, was ein wirkungsvolles Instrument zur Vermittlung ihrer Vision sein kann.

Einige wichtige Punkte über HTML-Farbnamen

  1. Um HTML-Farbnamen zu verwenden, müssen Sie die Farbnamen richtig schreiben! Bei HTML-Farbnamen wird die Groß- und Kleinschreibung nicht beachtet, Sie können also sowohl Klein- als auch Großbuchstaben verwenden. Zum Beispiel sind “darkred”, “DarkRed” und “DARKRED” gültig.
  2. HTML-Farbnamen haben eine begrenzte Farbpalette. Sie decken möglicherweise nicht alle möglichen Schattierungen oder Variationen ab. Wenn Sie eine bestimmte Farbe benötigen, die nicht durch einen HTML-Farbnamen repräsentiert wird, müssen Sie möglicherweise HEX-, RGB- oder andere Farbcodes verwenden. Sie können Color Converters verwenden, das sind kostenlose Online-Tools, mit denen Sie Farben zwischen verschiedenen Farbcodes wie HTML-Farbnamen, RGB, HEX, HSL, HSV, HWB, LAB, CMYK, LCH, XYZ usw. umwandeln können.
  3. HTML-Farbnamen sind in der Regel sehr kompatibel mit modernen Browsern. Einige sehr alte oder selten verwendete Browser unterstützen jedoch möglicherweise nur einige HTML-Farbnamen oder weisen leichte Unterschiede in der Interpretation auf.
  4. Es ist erwähnenswert, dass es in verschiedenen CSS-Frameworks, Bibliotheken und Design-Ressourcen erweiterte Listen von Farbnamen gibt, die nicht Teil des HTML-Standards selbst sind, aber häufig verwendet werden. Die erweiterten Farbnamen werden zwar nicht allgemein anerkannt oder von allen Browsern und Plattformen unterstützt, können aber in bestimmten Kontexten verwendet werden, in denen Kompatibilität kein Thema ist.
  5. Achten Sie bei der Verwendung von HTML-Farben für Ihre Webseiten darauf, dass die von Ihnen gewählten Farbnamen den Zugänglichkeitsrichtlinien entsprechen. Verwenden Sie Farbkombinationen, die ausreichend Kontrast bieten, um die Lesbarkeit für sehbehinderte Benutzer zu gewährleisten. Tools wie Color Contrast Checkers können Ihnen dabei helfen, zu überprüfen, ob die von Ihnen gewählten Farben den empfohlenen Zugänglichkeitsstandards entsprechen.
  6. HTML-Farbnamen sind subjektiv und können in verschiedenen Sprachen, Kulturen oder Kontexten unterschiedliche Interpretationen oder Assoziationen hervorrufen. Darüber hinaus werden die Farben selbst und Farbpaletten mit bestimmten Emotionen und Stimmungen assoziiert, die in verschiedenen Kulturen unterschiedlich sein können! Zum Beispiel wird die Farbe Weiß in der westlichen Gesellschaft mit Hochzeiten, Reinheit und Sauberkeit assoziiert. In vielen asiatischen Kulturen hingegen symbolisiert diese Farbe Tod, Trauer und Demut. Berücksichtigen Sie die beabsichtigte Bedeutung und den Kontext, wenn Sie Farben für die Lokalisierung Ihrer Websites auswählen.
  7. HTML-Farbnamen können in verschiedenen HTML-Attributen verwendet werden, mit denen Sie eine Farbe angeben können. Wir werden dies im nächsten Abschnitt des Artikels ausführlicher behandeln.

Arbeiten mit HTML-Farbnamen

HTML- und CSS-Farbnamen sind für alle, die in der Webentwicklung tätig sind, eine alltägliche Sache. In HTML und XHTML können Farben für Text, Hintergrund, Rahmenränder, Tabellen und einzelne Tabellenzellen verwendet werden. Sie können die Farbe auf die folgenden Arten einstellen:

Hier ist ein Beispiel für die Verwendung von HTML-Farbnamen zur Einfärbung von Text, Hintergründen und Rahmen. Wir verwenden verschiedene Methoden, um Farben zu spezifizieren:

 1<html>
 2	<head>
 3		<title>HTML color names</title>
 4		<style>
 5			h2 {
 6			color:DarkRed;
 7			}
 8			p {
 9			color:DimGray;
10			}
11		</style>
12	</head>
13	<body style="background-color:OldLace;">
14		<h2>Color Names List</h2>
15		<p>The HTML5 standard set of 147 color names, known as X11 color names, provides a color names list to represent different hues.</p>
16		<h2>Basic Color Names</h2>
17		<p style="background-color:White; border-style:solid; border-color:DarkRed"> There are 17 basic color names in HTML5. They are widely supported across different browsers and platforms.</p>
18	</body>
19</html>

Der gerenderte HTML-Code sieht wie folgt aus:

Text “Das Bild rendert den HTML-Code zum Einstellen der Text-, Hintergrund- und Rahmenfarbe”

Weitere Informationen zum Ändern der Text-, Hintergrund- oder Rahmenfarbe finden Sie in den Kapiteln Arbeiten mit HTML-Farbe und Anleitungsartikel. Die Artikel in diesem Kapitel beantworten häufig gestellte Fragen und enthalten C#-Beispiele, die die notwendigen Informationen über die Verwendung von Aspose.HTML for .NET zur Lösung bestimmter Aufgaben liefern.

Beschränkungen

Lustige Fakten

  1. Die Farben Grau und Grau, Cyan und Aqua, Fuchsia und Magenta haben die gleichen HEX- und RGB-Werte:

Text “Grey & Gray, Cyan & Aqua, Fuchsia & Magenta Farben mit HEX und RGB Codes”

Anscheinend konnten sich die Programmierer bei Hewlett-Packard nicht an die korrekte Schreibweise des Wortes “Grau” durch “a” (Gray) erinnern, so dass eine doppelte Option (Grey) hinzugefügt wurde, um Fehler im Code zu vermeiden. Diese Duplizierung beeinflusste einige weitere HTML-Farbnamen:

  1. Wir alle wissen, dass Red dem Farbcode #ff0000 entspricht. Der HTML-Farbname Blue entspricht dem Code #0000ff. Und wir erwarten, dass Green mit #00ff00 übereinstimmt. Aber nein! Der Farbname Green entspricht dem Code #008000. Und für #00ff00 müssen Sie Lime verwenden.

Text “Rote, blaue und grüne Farben mit HEX- und RGB-Codes”

  1. Schauen wir uns die Grautöne an. Wir erwarten nicht, dass Dunkelgrau heller als Grau ist!

Text “Dunkelgraue, graue und hellgraue Farben mit HEX- und RGB-Codes”

Vorschläge zur Umbenennung von HTML-Farben

Es werden Änderungen für drei Farben diskutiert, wobei vorgeschlagen wird, die alten Namen durch neue zu ersetzen:

Programmierer, Designer und Benutzer diskutieren weiterhin über Farbnamen, und das ist auch gut so. Wir geben Beispiele für einige der Diskussionen, die noch nicht in die offiziellen Spezifikationen eingeflossen sind. Für drei Farben werden Änderungen vorgeschlagen, wobei die alten Namen durch neue ersetzt werden sollen:

IndianRed ist nach einem berühmten roten Pigment aus Indien benannt und hat nichts mit den amerikanischen Ureinwohnern zu tun. Der Name “IndianRed” stammt von dem in Indien gefundenen roten Laterit, der aus natürlich vorkommenden Eisenoxiden besteht. Es wurde erstmals von dem schottischen Wissenschaftler Francis Buchanan-Hamilton identifiziert. Die erste Erwähnung von Indianerrot als Farbbezeichnung im Englischen stammt aus dem Jahr 1672.

Es ist erwähnenswert, dass “IndianRed” - der Name der Crayola-Buntstiftfarbe - von der Firma in “Kastanie” umbenannt wurde, wahrscheinlich aufgrund von Diskussionen um diesen Namen.

Text “Crayola Buntstifte vor und nach der Umbenennung”

Mokassinfarbe ist in erster Linie eine Farbe aus der Familie der gelben Farben. Sie ist eine Mischung aus orangefarbener und brauner Farbe. Vielleicht hat der Mokassin keine besondere Bedeutung. Es ist nur der Name einer Art von Schuh. Vielleicht kommt ein möglicher Einwand gegen einen solchen Farbnamen von der Tatsache, dass es sich um eine Art von Schuh handelt, der historisch gesehen von den amerikanischen Ureinwohnern stammt.

NavajoWhite ist ein blasser, pastellfarbener Gelb-Orange-Ton, der häufig für Innenräume in der Hausmalerei verwendet wird. Der Name der Farbe bezieht sich auf den Hintergrund der Flagge der Navajo Nation. Obwohl es sich um eine helle Farbe handelt, ist sie nicht weiß oder cremefarben, wie der Name vermuten lässt. Sie ähnelt anderen Farben wie Pfirsichblüte, Weizen und Mokassin.

Text “IndianRed, Mokassin und NavajoWhite Farben mit HEX und RGB Codes”

Online-Farbnamen

Die kostenlose Online-Anwendung Farbnamen sucht Farbnamen nach ihrem Farbcodewert. Geben Sie die Farbcodes in einem beliebigen Format ein, z. B. HTML Color Name, RGB, HEX, HSL, HSV, HWB, LAB, LCH, CMYK, XYZ, OKLAB oder OKLCH. Und Sie sehen eine Liste von Farbnamen mit maximaler “Ähnlichkeit”. Die Anwendung läuft auf Computern, Tablets und mobilen Geräten. Sie kann für Künstler und Designer hilfreich sein, die Farben verwenden müssen. Identifizieren Sie Farben mit unserer Color Names App und verwenden oder teilen Sie sie! Sicher, geschützt und übersichtlich.

Text “Kostenlose Online-Anwendung Color Names”

Hinweis: In der Anwendung wird unter “Ähnlichkeit” die Kosinusähnlichkeit verstanden, die auf dem Kosinus des Winkels zwischen den beiden Vektoren in einem mehrdimensionalen Farbraum (z. B. RGB, HSV) beruht. Die Kosinusähnlichkeit ist definiert als das Punktprodukt der Vektoren geteilt durch das Produkt ihrer Längen. Der Wert 1 bedeutet identische Farben und 0 bedeutet Orthogonalität (keine Ähnlichkeit).

Schlussfolgerungen

Siehe auch

HTML-Farbcodes Bild zu HTML hinzufügen
Subscribe to Aspose Product Updates

Get monthly newsletters & offers directly delivered to your mailbox.

© Aspose Pty Ltd 2001-2025. All Rights Reserved.