Einführung in HTML-Farbnamen

Die HTML-Farbnamen werden im Absatz richtig bezeichnet. Farben sind wichtig und werden nicht nur zum Dekorieren einer Webseite verwendet. In einigen Fällen möchten Sie möglicherweise die Textfarbe ändern, um einen besseren Kontrast zum Seitenhintergrund zu erzielen. Da HTML in Textform geschrieben ist, können Sie den Code nicht einfach nach Ihren Wünschen einfärben und erwarten, dass der Webbrowser beim Rendern der Seite dieselbe Farbe verwendet. Stattdessen müssen Sie Tags und Attribute verwenden, um dem Browser mitzuteilen, welche Farbe verwendet werden soll.

Farben in HTML

In HTML-Farbnamen können Farben anhand ihres Hexadezimalwerts oder ihres Namens angegeben werden. HTML unterstützt die meisten gängigen Farben. In diesem Artikel werde ich Ihnen 140 Namen und hexadezimale Werte dieser Farben mitteilen.

Beachten Sie, dass Sie sich nicht auf diese Farben beschränken müssen. Sie können ein beliebiges Farbwahltool verwenden, um den Hexadezimalwert einer beliebigen Farbe zu ermitteln und auf Ihrer Webseite zu verwenden.

HTML-Farbnamen verwenden

Das Implementieren von Farben auf Ihrer Webseite ist einfach und kann sowohl inline als auch über ein separates CSS-Stylesheet erfolgen.

Wenn Sie auf einer Seite mehrere Male dieselben HTML-Farbnamen verwenden, ist es besser, die Farben mithilfe des CSS-Blatts zu definieren und festzulegen. Wenn Sie dagegen nur ein- oder zweimal Farbe verwenden müssen, wird die Inline-Methode als besser angesehen.

1. HTML Color Inline verwenden


Brown H3 Heading
Gainsboro colored paragraph text


Brown H3 Heading
Gainsboro colored paragraph text


Brown H3 Heading
Gainsboro colored paragraph text


Brown H3 Heading
Gainsboro colored paragraph text


Brown H3 Heading
Gainsboro colored paragraph text

2. Implementierung in CSS

h1 ( color: Brown; )
p ( color: Gainsboro; )

Unterschiedliche HTML-Farbnamen

Nachdem Sie nun wissen, was HTML-Farbnamen sind und wie Sie sie auf Ihren Seiten verwenden können, finden Sie hier einen Link mit Farbnamen, die Sie als Lesezeichen speichern und in Ihren Projekten verwenden können:

1. Graue und schwarze HTML-Farbnamen

Graue und schwarze Farben sind in den meisten Fällen perfekt für die Textfarbe der Seite, da diese Farben vor einem weißen Hintergrund die beste Lesbarkeit aufweisen. Eine interessante Sache, die Sie beachten sollten, ist, dass moderne Telefone mit OLED-Displays keine Batterie benötigen, um die Farbe Schwarz anzuzeigen. Wenn Ihr Publikum mobil ist, ist es eine gute Idee, Schwarz als Hintergrundfarbe und Weiß oder anderes Licht zu verwenden Farben als Vordergrundfarbe.

CodeFarbe
# 000000Schwarz
# 0C090ANacht
# 2C3539Rotguss
# 2B1B17Mitternacht
# 34282CHolzkohle
# 25383CDunkles Schiefergrau
# 3B3131Öl
# 413839Schwarze Katze
# 3D3C3AIridium
# 463E3FSchwarzer Aal
# 4C4646Schwarze Kuh
# 504A4BGrauer Wolf
# 565051Vampirgrau
# 5C5858Grauer Delphin
# 625D5DCarbon Grey
# 666362Aschgrau
# 6D6968Bewölktes Grau
# 726E6DRauchgrau
# 736F6EGrau
# 837E7CGranit
# 848482Schlachtschiff Grau
# B6B6B4Graue Wolke
# D1D0CEgraue Gans
# Rotter4E2Platin
# BCC6CCSilbermetallic
# 98AFC7Blau grau
# 6D7B8DHellschiefergrau
# 657383Schiefer grau
# 616D7EJet Grey

2. Blaue HTML-Farbnamen

Blau unterstrichener Text wird als Link angesehen, da dies der Standard-Link-Stil für die meisten Webbrowser ist. Sie sollten vermeiden, für den gesamten Text auf einer Seite Blau zu verwenden, da Besucher ihn für Hyperlinks halten können.

# 646D7EMist Blue
# 566D7EMarmorblau
# 737CA1Schieferblau
# 4863A0Stahlblau
# 2B547EBlue Jay
# 2B3856Dunkles Schieferblau
# 151B54Mitternachtsblau
# 000080Navy blau
# 342D7EBlauwal
# 15317ELapisblau
# 151B8DDenim Dunkelblau
# 0000A0Erdblau
# 0020C2Kobaltblau
# 0041C2Blaubeerblau
# 2554C7Saphirblau
# 1569C7Blaue Augen
# 2B60DEKönigsblau
# 1F45FCBlaue orchidee
# 6960ECBlauer Lotus
# 736AFFHelles Schieferblau
# 357EC7Windows Blue
# 368BC1Gletscherblaues Eis
# 488AC7Seidenblau
# 3090C7Blauer Efeu
# 659EC7Blauer Koi
# 87AFC7Columbia Blue
# 95B9C7Baby blau
# 728FCEHelles Stahlblau
# 2B65ECMeerblau
# 306EFFBlaues Band
# 157DECBlaues Kleid
# 1589FFDodger Blue
# 6495EDKornblumenblau
# 6698FFHimmelblau
# 38ACECSchmetterlings-Blau
# 56A5ECEisberg
# 5CB3FFKristallblau
# 3BB9FFDeep Sky Blue
# 79BAECDenim Blue
# 82CAFAHelles Himmelblau
# 82CAFFTageshimmelblau
# A0CFECJeans blau
# B7CEECBlauer Engel
# B4CFECPastellblau
# C2DFFFMeeresblau
# C6DEFFPulverblau
#AFDCECKorallenblau
#ADDFFFHellblau
#BDEDFFRobin Egg Blue
#CFECECHellblaue Lilie
# E0FFFFHelles Cyan
# EBF4FAWasser
# F0F8FFAlice blau
# F0FFFFAzurblau
#CCFFFFLeichter Schiefer
# 93FFE8Leichter Aquamarin
# 9AFEFFElektrisches Blau
# 7FFFD4Aquamarin
# 00FFFFCyan oder Aqua
# 7DFDFETron Blue
# 57FEFFBlauer Zirkon
# 8EEBECBlaue Lagune
# 50EBECCeleste
# 4EE2ECBlauer Diamant
# 81D8D0Tiffany-Blau
# 92C7C7Cyan Opak
# 77BFC7Blaue Hosta
# 78C7C7Nordlichter blau
# 48CCCDMittlerer Türkis
# 43C6DBTürkis
# 46C7C7Qualle
# 7BCCB5Blau Grün

3. Grüne HTML-Farben

Auf Standorten, die mit Natur, Geld, Umwelt usw. zu tun haben, kann Grün eine gute Wahl für die Hintergrundfarbe sein.

# 43BFC7Ara blau grün
# 3EA99FHelles Meergrün
# 3B9C9CDunkler Türkis
# 438D80Meeresschildkröte-Grün
# 348781Mittlerer Aquamarin
# 307D7EGrünliches Blau
# 5E7D7EGrautürkis
# 4C787EKäfer grün
# 008080Blaugrün
# 4E8975Meeresgrün
# 78866BTarnung-Grün
# 848b79Salbeigrün
# 617C58Hazel Green
# 728C00Giftgrün
# 667C26Farn-Grün
# 254117Dunkles Waldgrün
# 306754Mittleres Meergrün
# 347235Mittleres Waldgrün
# 437C17Algengrün
# 387C44Kieferngrün
# 347C2CDschungel-Grün
# 347C17Kleeblattgrün
# 348017Mittleres Frühlingsgrün
# 4E9258Waldgrün
# 6AA121Grüne Zwiebel
# 4AA02CFrühlingsgrün
# 41A317Lindgrün
# 3EA055Klee-Grün
# 6CBB3CGrüne Schlange
# 6CC417Ausländisches Grün
# 4CC417Grüner Apfel
# 52D017Gelbgrün
# 4CC552Kelly Green
# 54C571Zombie-Grün
# 99C68EFrosch grün
# 89C35CGrüne Erbsen
# 85BB65Dollarschein Grün
# 8BB381Dunkles Meergrün
# 9CB071Leguan-Grün
# B2C248Avocado-Grün
# 9DC209Pistaziengrün
# A1C935Salatgrün
# 7FE817Kolibri-Grün
# 59E817Nebelgrün
# 57E964Ampel geht grün
# 64E986Algengrün
# 5EFB6EJadegrün
# 00FF00Grün
# 5FFB17Smaragdgrün
# 87F717Rasengrün
# 8AFB17Chartreuse
# 6AFB92Drachengrün
# 98FF98minzgrün
# B5EAAAGrüner Daumen
# C3FDB8Leichte Jade
# CCFB5DTee grün
# B1FB17Grün Gelb
# BCE954Schleimgrün
# EDDA74Goldrute
# EDE275Ernte Gold
# FFE87CSonnengelb

4. Gelbe HTML-Farbnamen

Gelb kann verwendet werden, um eine nicht ernsthafte Stimmung einzustellen, Kreativität und Optimismus auf einer Seite zu zeigen. Denken Sie daran, dass Gelb als Hintergrund besser geeignet ist als eine Textfarbe.

# FFFF00Gelb
# FFF380Maisgelb
# FFFFC2Pergament
#FFFFCCSahne
# FFF8C6Zitronen-Chiffon
# FFF8DCCornsilk
# F5F5DCBeige
# FBF6D9Blond
# FAEBD7Altweiß
# F7E7CEChampagner
#FFEBCDBlanchierte Mandel
# F3E5ABVanille
# ECE5B6Tan Brown
# FFE5B4Pfirsich
# FFDB58Senf
# FFD801Gummi Ducky Gelb
# FDD017Helles Gold
# EAC117goldbraun
# F2BB66Makaroni und Käse
# FBB917Safran
# FBB117Bier
# FFA62FCantaloup-Melone
# E9AB17Bienengelb

5. Braune HTML-Farben

Ein brauner Hintergrund kann das Lesen von weißem oder schwarzem Text erschweren. Sie können auch andere Farben verwenden, die einen guten Kontrast zu Ihrem Braunton aufweisen.

# E2A76FBrauner Zucker
# DEB887Kräftiges Holz
# FFCBA4Tiefer Pfirsich
# C9BE62Ingwer Braun
# E8A317Schulbus Gelb
# EE9A4DSandy Brown
# C8B560Herbstblatt Braun
# D4A017Orange Gold
# C2B280Sand
# C7A317Plätzchen Brown
# C68E17Karamell
# B5A642Messing
# ADA96EKhaki
# C19A6BKamelbraun
# CD7F32Bronze
# C88141Tiger Orange
# C58917Zimt
# AF9B60Bullet Shell
# AF7817Dunkle Goldrute
# B87333Kupfer
# 966F33Holz
# 806517Eiche Braun
# 827839Mokassin
# 827B60Army Brown
# 786D5FSandstein
# 493D26Mokka
# 483C32Taupe
# 6F4E37Kaffee
# 835C3BBraunbär
# 7F5217Roter Schmutz
# 7F462CSepia

6. Orange HTML-Farben

Orange eignet sich hervorragend, um einen Punkt hervorzuheben, an dem die Farbe als Hintergrund verwendet wird, und kann ein Gefühl der Begeisterung und Wärme hervorrufen, ohne zu klebrig zu sein.6. Orange HTML-Farben

# C47451Orangenlachs
# C36241Rost
# C35817Roter Fuchs
# C85A17Schokolade
# CC6600Sedona
# E56717Papaya Orange
# E66C2CHalloween-Orange
# F87217Kürbis-Orange
# F87431Baukegel Orange
# E67451Sonnenaufgang Orange
# FF8040Mango Orange
# F88017Dunkelorange
# FF7F50Koralle
# F88158Korbkugel Orange
# F9966BLeichter Lachs
# E78A61Mandarine
# E18B6BDunkler Lachs
# E77471Leichte Koralle
# F75D59Bohnenrot
# E55451Valentine Red
# E55B3CSchockierende Orange

7. Rote HTML-Farbcodes

Bei einigen Browsern wird rot unterstrichener Text als besuchte Links verwendet. Sie sollten ihn nicht verwenden, um die Besucher nicht zu verwirren.

# FF0000rot
# FF2400Scharlachrot
# F62217Rubinrot
# F70D1AFerrari Red
# F62817Feuerwehrauto Rot
# E42217Lava Red
# E41B17Liebe rot
# DC381FGrapefruit
# C34A2CKastanienrot
# C24641Kirschrot
# C04000Mahagoni
# C11B17Chili-Pfeffer
# 9F000FCranberry
# 990012Rotwein
# 8C001ABurgund
# 954535Kastanie
# 7E3517Blutrot
# 8A4117Sienna
# 7E3817Sangria
# 800517Schamottestein
# 810541Kastanienbraun
# 7D0541Plum Pie
# 7E354DVelvet Maroon
# 7D0552Pflaumensamt
# 7F4E52Rosiger Fink
# 7F5A58Puce
# 7F525DMattes Lila
# B38481Rosy Brown
# C5908EKhaki Rose

8. Rosa HTML-Farbcodes

Laut Farbwissenschaft können Pink und seine Farbtöne verwendet werden, wenn der Besucher ein Gefühl des Vertrauens, der Raffinesse und der Wärme in seinem Unterbewusstsein haben möchte.

# C48189Pinker Bogen
# C48793Lippenstift Pink
# E8ADAARose
# ECC5C0Rose Gold
# EDC9AFWüstensand
# FDD7E4Schwein rosa
#FCDFFFZuckerwatte
#FFDFDDRosa Kaugummi
# FBBBB9Misty Rose
#FAAFBERosa
#FAAFBAHell-Pink
# F9A7B0Flamingo Pink
# E7A1B0Pinke Rose
# E799A3Rosa Gänseblümchen
# E38AAECadillac Pink
# F778A1Nelkenrosa
# E56E94Erröten Sie rot
# F660ABPink
# FC6C85Wassermelonen-Rosa
# F6358AViolettes Rot
# F52887Dunkelrosa
# E45E9DRosafarbener kleiner Kuchen
# E4287CPinke Limonade
# F535AANeon Pink
# FF00FFMagenta
# E3319DDimorphotheca Magenta
# F433FFHelles Neonrosa
# D16587Hellviolettes Rot
# C25A7CTulpe Rosa
# CA226BMittelviolettes Rot
# C12869Rogue Pink
# C12267Gebranntes Rosa
# C25283Schüchternes Rosa
# C12283Dunkles Gartennelken-Rosa
# B93B8FPflaume

9. Lila und weiße HTML-Farbcodes

Die Verwendung von weißer Textfarbe vor weißem Hintergrund macht es für die Benutzer unlesbar. Abgesehen davon, dass es nicht benutzerfreundlich ist, können Sie eine SEO-Strafe für Ihre Website erhalten. Verwenden Sie daher immer Weiß und andere helle Farben vor dunklem Hintergrund.

# 7E587EViola Lila
# 571B7ELila Iris
# 583759Pflaumen-Purpur
# 4B0082Indigo
# 461B7ELila Monster
# 4E387ELila Nebel
# 614051Aubergine
# 5E5A80Traube
# 6A287ELila Marmelade
# 7D1B7EDunkle Orchidee
# A74AC7Lila Blume
# B048B5Mittlere Orchidee
# 6C2DC7Lila Amethyst
# 842DCEDunkelviolett
# 8D38C9Violett
# 7A5DC7Lila Salbei Bush
# 7F38ECSchönes Lila
# 8E35EFLila
# 893BFFAztech Lila
# 8467D7Mittellila
# A23BECJasmine Purple
# B041FFLila Narzisse
# C45AECTyrian Purple
# 9172ECKrokus Lila
# 9E7BFFLila Mimose
# D462FFHeliotrop Lila
# E238ECHochrot
# C38EC7Lila Drache
# C8A2C8Lila
# E6A9ECErröten Rosa
# E0B0FFMauve
# C6AEC7Glyzinien Lila
# F9B7FFBlüten-Rosa
# D2B9D3Distel
# E9CFECImmergrün
# EBDDE2Lavendel Pinocchio
# E3E4FALavendelblau
# FDEEF4Perle
# FFF5EEMuschel
#FEFCFFMilchweiß
#FFFFFFWeiß

Einige der am häufigsten verwendeten HTML-Farbcodes

Dies sind einige der populären Farben, die im Web verwendet werden. Ich habe sie in eine separate Tabelle gestellt, damit sie schnell gefunden werden können.

rot# FF0000Weiß#FFFFFF
Cyan# 00FFFFSilber# C0C0C0
Blau# 0000FFGrau oder Grau# 808080
Dunkelblau# 0000A0Schwarz# 000000
Hellblau# ADD8E6Orange# FFA500
Lila# 800080Braun# A52A2A
Gelb# FFFF00Kastanienbraun# 800000
Limette# 00FF00Grün# 008000
Magenta# FF00FFOlive# 808000

Fazit

Nachdem Sie über Kurzreferenztabellen gängiger HTML-Farben verfügen, sollten Sie in der Lage sein, jede gewünschte Farbe auf Ihrer Seite zu verwenden. Unter kreativen Gesichtspunkten sollten Sie möglichst keine scharfen Farben verwenden, und wenn Sie mit dem Front-End der Site arbeiten, ist es auch wichtig, die Hintergrundgrafiken oder -farben beizubehalten, um den richtigen Kontrast zu gewährleisten.

Empfohlene Artikel

Dies ist eine Anleitung zu HTML-Farbnamen. Hier diskutieren wir anhand von Beispielen, wie Farben auf einer Webseite mit verschiedenen HTML-Farben implementiert werden. Sie können auch unsere anderen Artikelvorschläge durchgehen, um mehr zu erfahren.

  1. HTML-Schriftarten
  2. HTML-Attribute
  3. HTML-Stylesheets
  4. Wie funktioniert HTML?
  5. Farben in Matlab | Wie ändere ich den Stil in Matlab?