Introduktion til HTML-farvenavne
HTML-farvenavne er korrekt angivet i para. Farver er vigtige, ikke kun de bruges til at dekorere en webside, men i nogle tilfælde ønsker du måske at ændre tekstfarven for at give en bedre kontrast til sidebaggrunden. I betragtning af HTML er en skrevet i tekstform, kan du ikke bare farve koden til din smag og forvente, at webbrowseren bruger den samme farve, når du gengiver siden. I stedet skal du ty til at bruge tags og attributter for at fortælle browseren, hvilken farve der skal bruges.
Farver i HTML
I HTML-farvenavne kan farver betegnes ved hjælp af deres hex-værdi eller dets navn. HTML har understøttelse af de mest almindelige farver. I denne artikel deler jeg med dig 140 navne og hex-værdier for disse farver.
Én ting at huske er, at du ikke behøver at begrænse dig til disse farver, du kan bruge et hvilket som helst farvevælgerværktøj til at finde Hex-værdien af enhver farve, du ønsker, og bruge den på din webside.
Brug af HTML-farvenavne
Implementering af farver på din webside er let og kan udføres både inline og via et separat CSS-stilark.
Når du skal bruge de samme HTML-farvenavne på en side flere gange, er det en bedre ide at bruge CSS-ark til at definere og indstille farver. Omvendt, hvis du kun skal bruge farve en eller to gange, betragtes anvendelse af inline-metoden som bedre.
1. Brug af HTML Color Inline
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
Brown H3 Heading
Gainsboro colored paragraph text
2. Implementering i CSS
h1 ( color: Brown; )
p ( color: Gainsboro; )
Forskellige HTML-farvenavne
Nu hvor du ved, hvad HTML-farvenavne er, og hvordan du kan bruge dem på dine sider, her er et link til farvenavne, som du kan bogmærke og bruge i dine projekter:
1. Grå og sort HTML farvenavne
Grå og sorte farver er i de fleste tilfælde perfekte til tekstens farve på siden da disse farver har den bedste læsbarhed på hvid baggrund. En interessant ting at huske er, at moderne telefoner med OLED-skærme, der er gjort, har brug for enhver batterikraft for at få vist sort farve, hvis dit publikum skal være på mobil, det er en klog idé at bruge sort som baggrundsfarve og hvidt eller andet lys farver som forgrundsfarve.
Kode | Farve |
# 000000 | Sort |
# 0C090A | Nat |
# 2C3539 | Gunmetal |
# 2B1B17 | Midnat |
# 34282C | Trækul |
# 25383C | Mørk skifergrå |
# 3B3131 | Olie |
# 413.839 | Sort kat |
# 3D3C3A | Iridium |
# 463E3F | Sort ål |
# 4C4646 | Sort ko |
# 504A4B | Grå Ulv |
# 565.051 | Vampyrgrå |
# 5C5858 | Grå delfin |
# 625D5D | Carbon Grey |
# 666.362 | Ash Grey |
# 6D6968 | Overskyet grå |
# 726E6D | Smokey Gray |
# 736F6E | Grå |
# 837E7C | Granit |
# 848.482 | Slagskib Grå |
# B6B6B4 | Grå sky |
# D1D0CE | Grå gås |
# E5E4E2 | platin |
# BCC6CC | Metallisk sølv |
# 98AFC7 | Blå grå |
# 6D7B8D | Lys skifergrå |
# 657.383 | Skifergrå |
# 616D7E | Jet Gray |
2. Blå HTML-farvenavne
Blå understreget tekst betragtes som et link, da det er standardlinkstilen for de fleste webbrowsere. Du skal undgå at bruge blåt til al tekst på en side, da besøgende kan forveksle det med hyperlinks.
# 646D7E | Mist blå |
# 566D7E | Marmorblå |
# 737CA1 | Skifer blå |
# 4863A0 | Stålblå |
# 2B547E | Blue Jay |
# 2B3856 | Mørke skifer blå |
# 151B54 | Midnight Blue |
# 000080 | Marine blå |
# 342D7E | Blåhval |
# 15317E | Lapis Blue |
# 151B8D | Denim mørkeblå |
# 0000A0 | Jorden blå |
# 0020C2 | Koboltblå |
# 0041C2 | Blåbærblå |
# 2554C7 | Safirblå |
# 1569C7 | Blå øjne |
# 2B60DE | Kongeblå |
# 1F45FC | Blue Orchid |
# 6960EC | Blue Lotus |
# 736AFF | Lys skiferblå |
# 357EC7 | Windows Blå |
# 368BC1 | Glacial Blue Ice |
# 488AC7 | Silkeblå |
# 3090C7 | Blå vedbend |
# 659EC7 | Blue Koi |
# 87AFC7 | Columbia Blue |
# 95B9C7 | Baby Blå |
# 728FCE | Lys stålblå |
# 2B65EC | Ocean Blue |
# 306EFF | Blå bånd |
# 157DEC | Blå kjole |
# 1589FF | Dodger Blue |
# 6495ED | Blomsterblå |
# 6698FF | Himmelblå |
# 38ACEC | Sommerfuglblå |
# 56A5EC | Isbjerg |
# 5CB3FF | Crystal Blue |
# 3BB9FF | Deep Sky Blue |
# 79BAEC | Denim Blue |
# 82CAFA | Lys himmelblå |
# 82CAFF | Day Sky Blue |
# A0CFEC | Jeans Blå |
# B7CEEC | Blue Angel |
# B4CFEC | Pastel blå |
# C2DFFF | Havblå |
# C6DEFF | Pulverblå |
#AFDCEC | Koralblå |
#ADDFFF | Lyseblå |
#BDEDFF | Robin Egg Blue |
#CFECEC | Bleg blå lilje |
# E0FFFF | Let Cyan |
# EBF4FA | Vand |
# F0F8FF | AliceBlue |
# F0FFFF | Azure |
#CCFFFF | Let skifer |
# 93FFE8 | Let akvamarin |
# 9AFEFF | Elektrisk blå |
# 7FFFD4 | akvamarin |
# 00FFFF | Cyan eller Aqua |
# 7DFDFE | Tron Blue |
# 57FEFF | Blå zirkon |
# 8EEBEC | Blå Lagune |
# 50EBEC | Celeste |
# 4EE2EC | Blue Diamond |
# 81D8D0 | Tiffany Blue |
# 92C7C7 | Cyan uigennemsigtig |
# 77BFC7 | Blue Hosta |
# 78C7C7 | Nordlys Blå |
# 48CCCD | Medium turkis |
# 43C6DB | turkis |
# 46C7C7 | Vandmand |
# 7BCCB5 | Blågrøn |
3. Grønne HTML-farver
På websteder, der er relateret til natur, penge, miljø osv., Kan Green være et godt valg af farve, der skal bruges som baggrund.
# 43BFC7 | Macaw Blue Green |
# 3EA99F | Lys havgrøn |
# 3B9C9C | Mørkt turkis |
# 438D80 | Sea Turtle Green |
# 348.781 | Medium akvamarin |
# 307D7E | Grønlig blå |
# 5E7D7E | Grålig turkis |
# 4C787E | Beetle Green |
# 008080 | Teal |
# 4E8975 | Havgrøn |
# 78866B | Camouflage Green |
# 848b79 | Sage Green |
# 617C58 | Hazel Green |
# 728C00 | Venom Green |
# 667C26 | Fern Green |
# 254.117 | Dark Forest Green |
# 306.754 | Medium Sea Green |
# 347.235 | Medium skovgrøn |
# 437C17 | Tanggrøn |
# 387C44 | Pine Green |
# 347C2C | Jungle Green |
# 347C17 | Shamrock Green |
# 348.017 | Medium Spring Green |
# 4E9258 | Forest Green |
# 6AA121 | Grønt løg |
# 4AA02C | Spring Green |
# 41A317 | Lime grøn |
# 3EA055 | Clover Green |
# 6CBB3C | Grøn slange |
# 6CC417 | Alien Green |
# 4CC417 | Grønt æble |
# 52D017 | Gul grøn |
# 4CC552 | Kelly Green |
# 54C571 | Zombie Green |
# 99C68E | Frog Green |
# 89C35C | Grønne ærter |
# 85BB65 | Dollar Bill Green |
# 8BB381 | Dark Sea Green |
# 9CB071 | Iguana Green |
# B2C248 | Avocado Green |
# 9DC209 | Pistache grøn |
# A1C935 | Salatgrøn |
# 7FE817 | Hummingbird Green |
# 59E817 | Nebula Green |
# 57E964 | Stoplight Go Green |
# 64E986 | Alger grøn |
# 5EFB6E | Jade Green |
# 00FF00 | Grøn |
# 5FFB17 | Smaragd grøn |
# 87F717 | Græsplæne grøn |
# 8AFB17 | Chartreuse |
# 6AFB92 | Dragon Green |
# 98FF98 | Mintgrøn |
# B5EAAA | Grøn tommelfinger |
# C3FDB8 | Let Jade |
# CCFB5D | Te grøn |
# B1FB17 | Grøn Gul |
# BCE954 | Slime Green |
# EDDA74 | Gyldenris |
# EDE275 | Høst guld |
# FFE87C | Solgul |
4. Gule HTML-farvenavne
Gul kan bruges til at indstille en ikke-seriøs stemning, vise kreativitet og optimisme på en side. Husk, at gult fungerer bedre som baggrund end en tekstfarve.
# FFFF00 | Gul |
# FFF380 | Majsgul |
# FFFFC2 | pergament |
#FFFFCC | Fløde |
# FFF8C6 | Lemon Chiffon |
# FFF8DC | CORNSiLK |
# F5F5DC | Beige |
# FBF6D9 | Blond |
# FAEBD7 | AntiqueWhite |
# F7E7CE | Champagne |
#FFEBCD | BlanchedAlmond |
# F3E5AB | vanilje |
# ECE5B6 | Tan Brown |
# FFE5B4 | Fersken |
# FFDB58 | Sennep |
# FFD801 | Gummi Ducky Yellow |
# FDD017 | Lys guld |
# EAC117 | gyldenbrun |
# F2BB66 | Makaroni og ost |
# FBB917 | safran |
# FBB117 | Øl |
# FFA62F | Melon |
# E9AB17 | Bee Yellow |
5. Brun HTML-farver
Brun baggrund kan gøre det vanskeligt at læse den hvide eller sorte tekst, du kan ty til andre farver, der har god kontrast mod din brunbrun.
# E2A76F | Brunt sukker |
# DEB887 | BurlyWood |
# FFCBA4 | Deep Peach |
# C9BE62 | Ingefær Brown |
# E8A317 | Skolebus gul |
# EE9A4D | Sandy Brown |
# C8B560 | Fall Leaf Brown |
# D4A017 | Orange guld |
# C2B280 | Sand |
# C7A317 | Cookie Brown |
# C68E17 | Karamel |
# B5A642 | Messing |
# ADA96E | khaki |
# C19A6B | Kamelbrun |
# CD7F32 | Bronze |
# C88141 | Tiger Orange |
# C58917 | Kanel |
# AF9B60 | Bullet Shell |
# AF7817 | Dark Goldenrod |
# B87333 | Kobber |
# 966F33 | Træ |
# 806.517 | Oak Brown |
# 827.839 | Moccasin |
# 827B60 | Army Brown |
# 786D5F | Sandsten |
# 493D26 | mokka |
# 483C32 | Taupe |
# 6F4E37 | Kaffe |
# 835C3B | Brun bjørn |
# 7F5217 | Red Dirt |
# 7F462C | Sepia |
6. Orange HTML-farver
Orange fungerer godt til at fremhæve et punkt, når farven bruges som baggrund, og det kan fremkalde en følelse af entusiasme og varme uden at være for klæbrig.6. Orange HTML-farver
# C47451 | Orange laks |
# C36241 | Rust |
# C35817 | Rød ræv |
# C85A17 | Chokolade |
# CC6600 | Sedona |
# E56717 | Papaya Orange |
# E66C2C | Halloween orange |
# F87217 | Græskar Orange |
# F87431 | Konstruktion kegle orange |
# E67451 | Solopgang Orange |
# FF8040 | Mango Orange |
# F88017 | Mørk orange |
# FF7F50 | Koral |
# F88158 | Basket Ball Orange |
# F9966B | Let laks |
# E78A61 | Tangerine |
# E18B6B | Mørk laks |
# E77471 | Let koral |
# F75D59 | Bean Red |
# E55451 | Valentine Red |
# E55B3C | Chokerende orange |
7. Røde HTML-farvekoder
For nogle browsere bruges rød understreget tekst som besøgte links, du skal undgå at bruge den til ikke at forvirre besøgende.
# FF0000 | Rød |
# FF2400 | rød |
# F62217 | Rubinrød |
# F70D1A | Ferrari Red |
# F62817 | Fire Engine Red |
# E42217 | Lava Red |
# E41B17 | Love Red |
# DC381F | Grapefrugt |
# C34A2C | Kastantrød |
# C24641 | Cherry Red |
# C04000 | Mahogni |
# C11B17 | Chili Pepper |
# 9F000F | tranebær |
# 990.012 | Rødvin |
# 8C001A | Bourgogne |
# 954.535 | kastanje |
# 7E3517 | Blodrød |
# 8A4117 | Sienna |
# 7E3817 | Sangria |
# 800.517 | firebrick |
# 810.541 | Maroon |
# 7D0541 | Plum Pie |
# 7E354D | Velvet Maroon |
# 7D0552 | Blomme Velvet |
# 7F4E52 | Rosy Finch |
# 7F5A58 | Puce |
# 7F525D | Dull Purple |
# B38481 | Rosy Brown |
# C5908E | Khaki Rose |
8. Lyserøde HTML-farvekoder
I henhold til farvevidenskab kan Pink og dets nuancer bruges, hvis du ønsker, at den besøgende skal have en følelse af selvtillid, raffinement og varme i deres underbevidsthed.
# C48189 | Pink Bow |
# C48793 | Læbestift Pink |
# E8ADAA | Rose |
# ECC5C0 | Rose guld |
# EDC9AF | Ørkenssand |
# FDD7E4 | Gris Pink |
#FCDFFF | Candyfloss |
#FFDFDD | Pink Bubble Gum |
# FBBBB9 | Misty Rose |
#FAAFBE | Lyserød |
#FAAFBA | Lyserød |
# F9A7B0 | Flamingo Pink |
# E7A1B0 | Pink Rose |
# E799A3 | Pink Daisy |
# E38AAE | Cadillac Pink |
# F778A1 | Nellik pink |
# E56E94 | Rød rød |
# F660AB | Hot pink |
# FC6C85 | Vandmelon Pink |
# F6358A | Violet rød |
# F52887 | Deep Pink |
# E45E9D | Pink Cupcake |
# E4287C | Pink Lemonade |
# F535AA | Neon Pink |
# FF00FF | Magenta |
# E3319D | Dimorphotheca Magenta |
# F433FF | Lys Neon Pink |
# D16587 | Blegviolet rød |
# C25A7C | Tulip Pink |
# CA226B | Medium Violet Red |
# C12869 | Rogue Pink |
# C12267 | Brændt lyserød |
# C25283 | Bashful Pink |
# C12283 | Dark Carnation Pink |
# B93B8F | Blomme |
9. Purple og hvid HTML farvekoder
Brug af hvid tekstfarve mod hvid baggrund vil gøre det ulæseligt for brugerne og bortset fra at ikke være brugervenligt, kan du få en SEO-straf for dit websted, således brug altid hvide og andre lyse farver mod mørk baggrund.
# 7E587E | Viola Purple |
# 571B7E | Purple Iris |
# 583.759 | Blomme lilla |
# 4B0082 | indigo |
# 461B7E | Purple Monster |
# 4E387E | Purple Haze |
# 614.051 | Aubergine |
# 5E5A80 | Grape |
# 6A287E | Purple Jam |
# 7D1B7E | Dark Orchid |
# A74AC7 | Lilla blomst |
# B048B5 | Medium Orchid |
# 6C2DC7 | Lilla ametyst |
# 842DCE | Mørk violet |
# 8D38C9 | Violet |
# 7A5DC7 | Purple Sage Bush |
# 7F38EC | Dejlig lilla |
# 8E35EF | Lilla |
# 893BFF | Aztech Purple |
# 8467D7 | Medium lilla |
# A23BEC | Jasmine lilla |
# B041FF | Lilla påskelilje |
# C45AEC | Tyrian Purple |
# 9172EC | Crocus Purple |
# 9E7BFF | Lilla Mimosa |
# D462FF | Heliotrope lilla |
# E238EC | Crimson |
# C38EC7 | Purple Dragon |
# C8A2C8 | Lilac |
# E6A9EC | Blush Pink |
# E0B0FF | Mauve |
# C6AEC7 | Wisteria Purple |
# F9B7FF | Blossom Pink |
# D2B9D3 | Thistle |
# E9CFEC | Periwinkle |
# EBDDE2 | Lavendel Pinocchio |
# E3E4FA | Lavendelblå |
# FDEEF4 | Perle |
# FFF5EE | SeaShell |
#FEFCFF | Mælk hvid |
#FFFFFF | hvid |
Nogle mest brugte HTML-farvekoder
Dette er nogle af de populære farver, der bruges på nettet, jeg har lagt dem i en separat tabel, så disse hurtigt kan findes.
Rød | # FF0000 | hvid | #FFFFFF |
Cyan | # 00FFFF | Sølv | # C0C0C0 |
Blå | # 0000FF | Grå eller grå | # 808080 |
Mørkeblå | # 0000A0 | Sort | # 000000 |
Lyseblå | # ADD8E6 | orange | # FFA500 |
Lilla | # 800080 | Brun | # A52A2A |
Gul | # FFFF00 | Maroon | # 800000 |
Citron | # 00FF00 | Grøn | # 008000 |
Magenta | # FF00FF | Oliven | # 808 tusind |
Konklusion
Nu når du har hurtige henvisningstabeller over almindelige HTML-farver, skal du være i stand til at bruge en hvilken som helst farve, du ønsker på din side. Fra et kreativt synspunkt skal du undgå at bruge hårde farver, hvis du kan, og når du arbejder med forreste ende af webstedet, at holde baggrundsgrafik eller farver også er vigtig for at sikre korrekt kontrast.
Anbefalede artikler
Dette er en guide til HTML-farvenavne. Her diskuterer vi, hvordan man implementerer farver på en webside ved hjælp af forskellige HTML-farver med eksempler. Du kan også gennemgå vores andre foreslåede artikler for at lære mere–
- HTML-skrifttyper
- HTML-attributter
- HTML stilark
- Sådan fungerer HTML
- Farver i Matlab | Sådan ændres stilen i Matlab?