Uvod v imena barvnih HTML
Imena barv HTML so v odstavku pravilno označena. Barve so pomembne, saj se uporabljajo ne samo za okrasitev spletne strani, ampak v nekaterih primerih boste morda želeli spremeniti barvo besedila, da boste zagotovili boljši kontrast glede na ozadje strani. Glede na to, da je HTML napisan v besedilni obliki, ne morete samo pobarvati kode po svoji želji in pričakovati, da bo spletni brskalnik pri upodabljanju strani uporabil isto barvo. Namesto tega se boste morali zateči k uporabi oznak in atributov, da boste brskalniku povedali, katero barvo naj uporablja.
Barve v HTML
V barvnih imenih HTML lahko barve označimo z uporabo šestnajstih vrednosti ali imena. HTML ima podporo za najpogostejše barve, v tem članku bom z vami delil 140 imen in šestnajstih vrednosti teh barv.
Ne pozabite, da se vam ni treba omejiti na te barve, lahko uporabite katero koli orodje za izbiro barv, da najdete šestnajsto vrednost katere koli barve in jo uporabite na svoji spletni strani.
Uporaba barvnih imen HTML
Izvedba barv na vaši spletni strani je enostavna in se lahko izvede tako v liniji kot prek ločenega obrazca CSS Stylesheet.
Ko boste na isti strani večkrat uporabljali enaka imena barv HTML, je bolje določiti CSS list za določanje in nastavitev barv. Nasprotno, če morate barvo uporabiti samo enkrat ali dvakrat, se uporaba metode vdelave šteje za boljše.
1. Uporaba 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. Izvajanje v CSS
h1 ( color: Brown; )
p ( color: Gainsboro; )
Različna imena barvnih HTML
Zdaj, ko veste, kaj so imena barvnih HTML in kako jih lahko uporabite na svojih straneh, je tu povezava imen barv, ki jih lahko zaznamujete in uporabljate v svojih projektih:
1. Siva in črna HTML imena barv
Siva in črna barva sta v večini primerov kot nalašč za barvo besedila strani, saj imata na belem ozadju najboljšo berljivost. Pomembno je vedeti, da sodobni telefoni z dokončanimi OLED zasloni potrebujejo baterijo za prikaz črne barve, če bo vaše občinstvo mobilno, pametna ideja je, da črno uporabite kot barvo ozadja in belo ali drugo svetlobo barve kot barva ospredja.
| Koda | Barva |
| # 000000 | Črna |
| # 0C090A | Noč |
| # 2C3539 | Gunmetal |
| # 2B1B17 | Polnoč |
| # 34282C | Oglje |
| # 25383C | Temno skrilavca siva |
| # 3B3131 | Olje |
| # 413839 | Črna mačka |
| # 3D3C3A | Iridij |
| # 463E3F | Črna jegulja |
| # 4C4646 | Črna krava |
| # 504A4B | Sivi volk |
| # 565051 | Vampir siva |
| # 5C5858 | Sivi delfin |
| # 625D5D | Carbon Grey |
| # 666362 | Pepel siv |
| # 6D6968 | Oblačno siva |
| # 726E6D | Smokey Grey |
| # 736F6E | siva |
| # 837E7C | Granit |
| # 848482 | Bojna ladja Siva |
| # B6B6B4 | Sivi oblak |
| # D1D0CE | Siva gos |
| # E5E4E2 | Platina |
| # BCC6CC | Kovinsko srebrna |
| # 98AFC7 | Modro siva |
| # 6D7B8D | Svetlo siva skrilavka |
| # 657383 | Skrilasto siva |
| # 616D7E | Jet Grey |
2. Modra barvna imena HTML
Modro podčrtano besedilo velja za povezavo, saj je privzeti slog povezave za večino spletnih brskalnikov, izogibajte se uporabi modre barve za celotno besedilo na strani, saj ga lahko obiskovalci zmotijo zaradi hiperpovezav.
| # 646D7E | Megleno modra |
| # 566D7E | Marmorno modra |
| # 737CA1 | Skrilasto modra |
| # 4863A0 | Jekleno modra |
| # 2B547E | Blue Jay |
| # 2B3856 | Temno skrilavca modra |
| # 151B54 | Polnočno modro |
| # 000080 | Mornarsko modra |
| # 342D7E | Modri kit |
| # 15317E | Lapis Blue |
| # 151B8D | Denim temno modra |
| # 0000A0 | Zemljinsko modra |
| # 0020C2 | Kobaltno modra |
| # 0041C2 | Blueberry Blue |
| # 2554C7 | Safirno modra |
| # 1569C7 | Modre oči |
| # 2B60DE | Kraljevsko modra |
| # 1F45FC | Modra orhideja |
| # 6960EC | Modri Lotus |
| # 736AFF | Svetlo skrilasto modra |
| # 357EC7 | Windows Blue |
| # 368BC1 | Ledeniško modri led |
| # 488AC7 | Svileno modra |
| # 3090C7 | Modri bršljan |
| # 659EC7 | Modri Koi |
| # 87AFC7 | Columbia Blue |
| # 95B9C7 | Svetlo modra |
| # 728FCE | Svetlo jekleno modro |
| # 2B65EC | Ocean modra |
| # 306EFF | Modri trak |
| # 157DEC | Modra obleka |
| # 1589FF | Dodger Blue |
| # 6495ED | Koruzno modra |
| # 6698FF | Modro nebo |
| # 38ACEC | Metulja modra |
| # 56A5EC | Ledenica |
| # 5CB3FF | Kristalno modra |
| # 3BB9FF | Globoko nebesno modra |
| # 79BAEC | Denim modra |
| # 82CAFA | Svetlo nebesno modra |
| # 82CAFF | Dnevno nebesno modro |
| # A0CFEC | Jeans modre |
| # B7CEEC | Modri angel |
| # B4CFEC | Pastelno modra |
| # C2DFFF | Morsko modro |
| # C6DEFF | Prašno modra |
| #AFDCEC | Koralno modra |
| #ADDFFF | Svetlo modra |
| #BDEDFF | Robin Egg Blue |
| #CFECEC | Bledo modra lilija |
| # E0FFFF | Svetlo cijan |
| # EBF4FA | Voda |
| # F0F8FF | AliceBlue |
| # F0FFFF | Azure |
| #CCFFFF | Lahka skrilavca |
| # 93FFE8 | Lahka akvamarina |
| # 9AFEFF | Električno modra |
| # 7FFFD4 | Akvamarin |
| # 00FFFF | Cyan ali Aqua |
| # 7DFDFE | Tron Blue |
| # 57FEFF | Modri cirkon |
| # 8EEBEC | Modra laguna |
| # 50EBEC | Celeste |
| # 4EE2EC | Modri diamant |
| # 81D8D0 | Tiffany Blue |
| # 92C7C7 | Cyan Opaque |
| # 77BFC7 | Modra Hosta |
| # 78C7C7 | Severna luč modra |
| # 48CCCD | Srednje turkizna |
| # 43C6DB | Turkizna |
| # 46C7C7 | Meduze |
| # 7BCCB5 | Modro zelena |
3. Zelene HTML barve
Na spletnih mestih, povezanih z naravo, denarjem, okoljem itd., Je zelena lahko dobra izbira barve za ozadje.
| # 43BFC7 | Maka modro zelena |
| # 3EA99F | Svetlo morje zeleno |
| # 3B9C9C | Temno turkizna |
| # 438D80 | Morska želva zelena |
| # 348781 | Srednja akvamarina |
| # 307D7E | Zelenkasto modra |
| # 5E7D7E | Sivkasto turkizna |
| # 4C787E | Beetle Green |
| # 008080 | Zelenomodra |
| # 4E8975 | Morsko zeleno |
| # 78866B | Kamuflaža zelena |
| # 848b79 | Žajbelj zelen |
| # 617C58 | Lešnik zelen |
| # 728C00 | Venom zelena |
| # 667C26 | Fern Green |
| # 254117 | Temno gozdna zelena |
| # 306754 | Srednje morsko zeleno |
| # 347235 | Srednje gozdno zeleno |
| # 437C17 | Morske alge zelene |
| # 387C44 | Pine Green |
| # 347C2C | Jungle Green |
| # 347C17 | Shamrock Green |
| # 348017 | Srednje pomladno zelena |
| # 4E9258 | Gozdna zelena |
| # 6AA121 | Zelena čebula |
| # 4AA02C | Pomladno zelena |
| # 41A317 | Lime zelena |
| # 3EA055 | Deteljica zelena |
| # 6CBB3C | Zelena kača |
| # 6CC417 | Alien Green |
| # 4CC417 | Zeleno jabolko |
| # 52D017 | Rumena zelena |
| # 4CC552 | Kelly Green |
| # 54C571 | Zombie Green |
| # 99C68E | Žabja zelena |
| # 89C35C | Grah |
| # 85BB65 | Dollar Bill Green |
| # 8BB381 | Temno morje zeleno |
| # 9CB071 | Iguana Green |
| # B2C248 | Avokado zelen |
| # 9DC209 | Pistacija zelena |
| # A1C935 | Solata zelena |
| # 7FE817 | Kolibri zeleni |
| # 59E817 | Meglica Zelena |
| # 57E964 | Stoplight Go Green |
| # 64E986 | Alge Zelena |
| # 5EFB6E | Jade Green |
| # 00FF00 | Zelena |
| # 5FFB17 | Smaragdno zelena |
| # 87F717 | Lawn Green |
| # 8AFB17 | Chartreuse |
| # 6AFB92 | Dragon Green |
| # 98FF98 | Mint zelena |
| # B5EAAA | Zelena palca |
| # C3FDB8 | Lahka žada |
| # CCFB5D | Čaj zeleni |
| # B1FB17 | Zeleno rumena |
| # BCE954 | Slime Green |
| # EDDA74 | Goldenrod |
| # EDE275 | Žetveno zlato |
| # FFE87C | Sončno rumena |
4. Rumena imena barv HTML
Rumena lahko uporabite za določitev neresnega razpoloženja, za izkazovanje kreativnosti in optimizma na strani. Upoštevajte, da rumena deluje bolje kot ozadje kot barva besedila.
| # FFFF00 | Rumena |
| # FFF380 | Koruzno rumena |
| # FFFFC2 | Pergament |
| #FFFFCC | Krema |
| # FFF8C6 | Limon šifon |
| # FFF8DC | Cornsilk |
| # F5F5DC | Bež |
| # FBF6D9 | Blondinka |
| # FAEBD7 | AntiqueWhite |
| # F7E7CE | Šampanjec |
| #FFEBCD | BlanchedAlmond |
| # F3E5AB | Vanilija |
| # ECE5B6 | Rjava rjava |
| # FFE5B4 | Breskev |
| # FFDB58 | Gorčica |
| # FFD801 | Guma Ducky Yellow |
| # FDD017 | Svetlo zlato |
| # EAC117 | zlatorjavo |
| # F2BB66 | Makaroni in sir |
| # FBB917 | Žafran |
| # FBB117 | Pivo |
| # FFA62F | Cantaloupe |
| # E9AB17 | Čebelica rumena |
5. Rjava barva HTML
Rjavo ozadje lahko oteži branje belega ali črnega besedila, lahko se zatečete k uporabnikom drugih barv, ki so v dobrem kontrastu z vašim odtenkom rjave.
| # E2A76F | Rjavi sladkor |
| # DEB887 | BurlyWood |
| # FFCBA4 | Globoka breskev |
| # C9BE62 | Ginger Brown |
| # E8A317 | Šolski avtobus Rumena |
| # EE9A4D | Sandy Brown |
| # C8B560 | Padec rjave barve |
| # D4A017 | Oranžno zlato |
| # C2B280 | Pesek |
| # C7A317 | Piškotek Brown |
| # C68E17 | Karamela |
| # B5A642 | Medenina |
| # ADA96E | Khaki |
| # C19A6B | Kamel rjava |
| # CD7F32 | Bronasta |
| # C88141 | Tiger pomaranča |
| # C58917 | Cimet |
| # AF9B60 | Bullet Shell |
| # AF7817 | Temni Goldenrod |
| # B87333 | baker |
| # 966F33 | Les |
| # 806517 | Hrast rjav |
| # 827839 | Mokasin |
| # 827B60 | Army Brown |
| # 786D5F | Peščenjak |
| # 493D26 | Mocha |
| # 483C32 | Taupe |
| # 6F4E37 | Kava |
| # 835C3B | Rjavi medved |
| # 7F5217 | Rdeča umazanija |
| # 7F462C | Sepia |
6. Oranžne HTML barve
Oranžna barva odlično poudarja točko, ko je barva uporabljena kot ozadje in lahko vzbudi občutek navdušenja in topline, ne da bi bil preveč lepljiv.6. Oranžne barve HTML
| # C47451 | Pomarančni losos |
| # C36241 | Rust |
| # C35817 | Rdeča lisica |
| # C85A17 | Čokolada |
| # CC6600 | Sedona |
| # E56717 | Papaya pomaranča |
| # E66C2C | Oranžna noč čarovnic |
| # F87217 | Bučna pomaranča |
| # F87431 | Konus Orange v gradbeništvu |
| # E67451 | Oranžni sončni vzhod |
| # FF8040 | Mango pomaranča |
| # F88017 | Temno oranžna |
| # FF7F50 | Koral |
| # F88158 | Oranžna žogica za košarico |
| # F9966B | Lahki losos |
| # E78A61 | Mandarina |
| # E18B6B | Temni losos |
| # E77471 | Lahki koral |
| # F75D59 | Bean rdeč |
| # E55451 | Valentine Rdeče |
| # E55B3C | Šokantno pomaranča |
7. Rdeče barvne kode HTML
V nekaterih brskalnikih se kot obiskane povezave uporablja rdeče podčrtano besedilo, izogibajte se mu, da ne bi zmedli obiskovalcev.
| # FF0000 | rdeča |
| # FF2400 | Škrlatno |
| # F62217 | Ruby Red |
| # F70D1A | Ferrari Red |
| # F62817 | Požarni motor rdeče barve |
| # E42217 | Lava rdeča |
| # E41B17 | Ljubezen rdeče |
| # DC381F | Grenivke |
| # C34A2C | Kostanjevo rdeče |
| # C24641 | Češnjev rdeč |
| # C04000 | Mahagoni |
| # C11B17 | Čili poper |
| # 9F000F | Brusnica |
| # 990012 | Rdeče vino |
| # 8C001A | Burgundija |
| # 954535 | kostanj |
| # 7E3517 | Kri rdeče |
| # 8A4117 | Sienna |
| # 7E3817 | Sangria |
| # 800517 | Firebrick |
| # 810541 | Maroon |
| # 7D0541 | Slivova pita |
| # 7E354D | Velvet Maroon |
| # 7D0552 | Plum Velvet |
| # 7F4E52 | Rosy Finch |
| # 7F5A58 | Puce |
| # 7F525D | Dolgočasno vijolično |
| # B38481 | Rosy Brown |
| # C5908E | Khaki Rose |
8. Roza HTML barvne kode
Glede na barvno znanost je Pink in njegove odtenke mogoče uporabiti, če želite, da ima obiskovalec občutek zaupanja, prefinjenosti in topline v svoji podzavesti.
| # C48189 | Roza lok |
| # C48793 | Šminka roza |
| # E8ADAA | Rose |
| # ECC5C0 | Rose Gold |
| # EDC9AF | Puščavski pesek |
| # FDD7E4 | Prašičasto roza |
| #FCDFFF | Bombažni bomboni |
| #FFDFDD | Roza gumba za mehurčke |
| # FBBBB9 | Misty Rose |
| #FAAFBE | Roza |
| #FAAFBA | Svetlo roza |
| # F9A7B0 | Flamingo roza |
| # E7A1B0 | Rožna vrtnica |
| # E799A3 | Rožna marjetica |
| # E38AAE | Cadillac roza |
| # F778A1 | Nageljni roza |
| # E56E94 | Rdeče rdeče |
| # F660AB | Vroče roza |
| # FC6C85 | Lubenica roza |
| # F6358A | Vijolično rdeča |
| # F52887 | Globoko roza |
| # E45E9D | Roza Cupcake |
| # E4287C | Rožna limonada |
| # F535AA | Neon roza |
| # FF00FF | Magenta |
| # E3319D | Dimorphotheca Magenta |
| # F433FF | Svetla neonska roza |
| # D16587 | Bledo vijolično rdeča |
| # C25A7C | Tulipan roza |
| # CA226B | Srednje vijolično rdeča |
| # C12869 | Rogue Pink |
| # C12267 | Izgorela roza |
| # C25283 | Bashful Pink |
| # C12283 | Temno nageljno roza |
| # B93B8F | Sliva |
9. Vijolične in bele HTML barvne kode
Če uporabite barvo Belo besedilo na belem ozadju, ga uporabniki ne bodo berljivi in razen, da ni prijazen do uporabnika, lahko za svojo spletno stran dobite kazen SEO, vedno uporabljajte belo in druge svetle barve proti temnim ozadjem.
| # 7E587E | Viola vijolična |
| # 571B7E | Vijolična šarenica |
| # 583759 | Šljiva škrlatna |
| # 4B0082 | Indigo |
| # 461B7E | Vijolična pošast |
| # 4E387E | Vijolična meglica |
| # 614051 | Jajčevec |
| # 5E5A80 | Grozdje |
| # 6A287E | Vijolična marmelada |
| # 7D1B7E | Temna orhideja |
| # A74AC7 | Vijolična roža |
| # B048B5 | Srednja orhideja |
| # 6C2DC7 | Vijolični ametist |
| # 842DCE | Temno vijolična |
| # 8D38C9 | Vijolična |
| # 7A5DC7 | Vijolični žajbelj |
| # 7F38EC | Ljubko vijolično |
| # 8E35EF | Vijolična |
| # 893BFF | Aztech vijolično |
| # 8467D7 | Srednje vijolično |
| # A23BEC | Jasmine Vijolična |
| # B041FF | Vijolična narcis |
| # C45AEC | Tirijska vijolična |
| # 9172EC | Crocus Purple |
| # 9E7BFF | Vijolična Mimoza |
| # D462FF | Heliotrope vijolična |
| # E238EC | Crimson |
| # C38EC7 | Vijolični zmaj |
| # C8A2C8 | Siva |
| # E6A9EC | Rumenasto roza |
| # E0B0FF | Mauve |
| # C6AEC7 | Wisteria Purple |
| # F9B7FF | Cvet roza |
| # D2B9D3 | Dušica |
| # E9CFEC | Periwinkle |
| # EBDDE2 | Sivka pinocchio |
| # E3E4FA | Sivka modra |
| # FDEEF4 | Biser |
| # FFF5EE | SeaShell |
| #FEFCFF | Mlečno belo |
| #FFFFFF | Bela |
Nekatere najpogosteje uporabljene barvne kode HTML
To je nekaj priljubljenih barv, ki se uporabljajo v spletu, dal sem jih v ločeno tabelo, tako da jih je mogoče hitro najti.
| rdeča | # FF0000 | Bela | #FFFFFF |
| Cijan | # 00FFFF | Srebrna | # C0C0C0 |
| Modro | # 0000FF | Siva ali siva | # 808080 |
| Temno modra | # 0000A0 | Črna | # 000000 |
| Svetlo modra | # ADD8E6 | Oranžna | # FFA500 |
| Vijolična | # 800080 | rjav | # A52A2A |
| Rumena | # FFFF00 | Maroon | # 800000 |
| Apnenec | # 00FF00 | Zelena | # 008000 |
| Magenta | # FF00FF | Oljka | # 808000 |
Zaključek
Zdaj, ko imate kratke referenčne tabele običajnih barv HTML, bi morali imeti možnost, da na svoji strani uporabite katero koli barvo, ki jo želite. Z ustvarjalnega stališča se izogibajte uporabi ostrih barv, če lahko in kadar delate s sprednjim delom spletnega mesta, je za pravilno kontrast pomembno tudi ohranjanje grafike ozadja ozadja.
Priporočeni članki
To je vodnik za imena barvnih HTML. Tukaj razpravljamo o tem, kako implementirati barve na spletno stran z uporabo različnih barv HTML s primeri. Obiščite lahko tudi druge naše predlagane članke, če želite izvedeti več -
- Slogi pisav HTML
- Atributi HTML
- Tabele sloga HTML
- Kako deluje HTML
- Barve v Matlabu | Kako spremeniti slog v Matlabu?