Sissejuhatus HTML-i värvinimedesse
HTML-värvinimed on para-tekstis õigesti tähistatud. Värvid on olulised, neid kasutatakse mitte ainult veebilehe kaunistamiseks, vaid mõnel juhul võib tekkida soov muuta teksti värvi, et pakkuda paremat kontrasti lehe taustal. Arvestades, et HTML on kirjutatud teksti kujul, ei saa te koodi lihtsalt oma maitse järgi värvida ja eeldada, et veebibrauser kasutab lehe renderdamisel sama värvi. Selle asemel peate kasutama silte ja atribuute, et öelda brauserile, millist värvi kasutada.
Värvid HTML-is
HTML-i värvinimedes saab värve tähistada nende heksaväärtuse või nime abil. HTML toetab kõige levinumaid värve, selles artiklis jagan teiega nende värvide 140 nime ja heksooni väärtust.
Üks asi, mida tuleks meeles pidada, on see, et te ei pea piirduma nende värvidega, võite kasutada mis tahes värvivalija tööriista, et leida mis tahes värvi heks väärtus ja kasutada seda oma veebilehel.
HTML-värvinimede kasutamine
Värvide rakendamine oma veebilehele on lihtne ja seda saab teha nii sisemiselt kui ka eraldi CSS-i laadilehe kaudu.
Kui kasutate lehel samu HTML-i värvinimesid mitu korda, on parem kasutada värvide määratlemiseks ja määramiseks CSS-lehte. Ja kui peate värvi kasutama ainult üks või kaks korda, peetakse tekstisisese meetodi kasutamist paremaks.
1. HTML-värvilise teksti kasutamine
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. Rakendamine CSS-is
h1 ( color: Brown; )
p ( color: Gainsboro; )
Erinevad HTML-i värvinimed
Nüüd, kui teate, mis on HTML-i värvinimed ja kuidas saate neid oma lehtedel kasutada, on siin link värvinimetustele, mida saate järjehoidjatesse lisada ja oma projektides kasutada:
1. Hallid ja mustad HTML-i värvinimed
Hallid ja mustad värvid sobivad enamasti lehe teksti värviga ideaalselt, kuna valge tausta taustal on need värvid kõige paremini loetavad. Üks huvitav asi, mida tuleks meeles pidada, on see, et kaasaegsed OLED-ekraanidega telefonid vajavad musta värvi kuvamiseks akut, kui teie vaatajaskond kavatseb liikuda, siis on mõistlik kasutada taustavärvina musta värvi ja valget või muud valgust värvid esiplaani värvina.
| Kood | Värv |
| # 000000 | Must |
| # 0C090A | Öö |
| # 2C3539 | Gunmetal |
| # 2B1B17 | Kesköö |
| # 34282C | Puusüsi |
| # 25383C | Tume kiltkivihall |
| # 3B3131 | Õli |
| # 413839 | Must kass |
| # 3D3C3A | Iriidium |
| # 463E3F | Must angerjas |
| # 4C4646 | Must lehm |
| # 504A4B | Hall hunt |
| # 565051 | Vampiir hall |
| # 5C5858 | Hall delfiin |
| # 625D5D | Süsinikuhall |
| # 666362 | Ash Hall |
| # 6D6968 | Pilves hall |
| # 726E6D | Suitsune hall |
| # 736F6E | Hall |
| # 837E7C | Graniit |
| # 848482 | Lahingulaev hall |
| # B6B6B4 | Hall pilv |
| # D1D0CE | Hall hani |
| # E5E4E2 | Plaatina |
| # BCC6CC | Metallik hõbe |
| # 98AFC7 | Sinine hall |
| # 6D7B8D | Hele kiltkivihall |
| # 657383 | Kiltkivi hall |
| # 616D7E | Jet Gray |
2. Sinised HTML-i värvinimed
Sinist allajoonitud teksti peetakse lingiks, kuna see on enamiku veebibrauserite vaikelingi stiil. Peaksite vältima sinise kasutamist kogu lehe teksti jaoks, kuna külastajad võivad seda hüperlinkide korral eksida.
| # 646D7E | Udu sinine |
| # 566D7E | Marmor sinine |
| # 737CA1 | Kiltkivi sinine |
| # 4863A0 | Terasinine |
| # 2B547E | Sinine Jay |
| # 2B3856 | Tume kiltkivi sinine |
| # 151B54 | Kesköö sinine |
| # 000080 | Mereväe sinine |
| # 342D7E | Sinine vaal |
| # 15317E | Lapis sinine |
| # 151B8D | Denim tumesinine |
| # 0000A0 | Maa sinine |
| # 0020C2 | Koobaltisinine |
| # 0041C2 | Mustikas sinine |
| # 2554C7 | Safiir sinine |
| # 1569C7 | Sinised silmad |
| # 2B60DE | Sügavsinine |
| # 1F45FC | Sinine orhidee |
| # 6960EC | Sinine lootos |
| # 736AFF | Hele kiltkivi sinine |
| # 357EC7 | Windows sinine |
| # 368BC1 | Liustikuline sinine jää |
| # 488AC7 | Siidist sinine |
| # 3090C7 | Sinine luuderohi |
| # 659EC7 | Sinine Koi |
| # 87AFC7 | Columbia sinine |
| # 95B9C7 | Beebisinine |
| # 728FCE | Hele teras sinine |
| # 2B65EC | Ookeani sinine |
| # 306EFF | Sinine lint |
| # 157DEC | Sinine kleit |
| # 1589FF | Dodger sinine |
| # 6495ED | Rukkilille sinine |
| # 6698FF | Taevasinine |
| # 38ACEC | Liblikasinine |
| # 56A5EC | Jäämägi |
| # 5CB3FF | Kristallsinine |
| # 3BB9FF | Deep Sky Blue |
| # 79BAEC | Denim sinine |
| # 82CAFA | Hele taevasinine |
| # 82CAFF | Päeva taevasinine |
| # A0CFEC | Teksad sinised |
| # B7CEEC | Sinine Ingel |
| # B4CFEC | Pastellsinine |
| # C2DFFF | Meresinine |
| # C6DEFF | Pulber sinine |
| #AFDCEC | Koralli sinine |
| #ADDFFF | Helesinine |
| #BDEDFF | Robin munasinine |
| #CFECEC | Kahvatu sinine liilia |
| # E0FFFF | Hele tsüaan |
| # EBF4FA | Vesi |
| # F0F8FF | AliceBlue |
| # F0FFFF | Azure |
| #CCFFFF | Hele kiltkivi |
| # 93FFE8 | Kerge akvamariin |
| # 9AFEFF | Elektriline sinine |
| # 7FFFD4 | Akvamariin |
| # 00FFFF | Cyan või Aqua |
| # 7DFDFE | Tron sinine |
| # 57FEFF | Sinine tsirkoon |
| # 8EEBEC | Sinine Laguun |
| # 50EBEC | Celeste |
| # 4EE2EC | Sinine teemant |
| # 81D8D0 | Tiffany sinine |
| # 92C7C7 | Tsüaan läbipaistmatu |
| # 77BFC7 | Sinine Hosta |
| # 78C7C7 | Virmalised sinised |
| # 48CCCD | Keskmine türkiissinine |
| # 43C6DB | Türkiissinine |
| # 46C7C7 | Meduus |
| # 7BCCB5 | Sinine Roheline |
3. Rohelised HTML-värvid
Looduse, raha, keskkonna jms seotud saitidel võib roheline olla hea värvivalik taustana kasutamiseks.
| # 43BFC7 | Ara sinine roheline |
| # 3EA99F | Hele meri roheline |
| # 3B9C9C | Tume türkiissinine |
| # 438D80 | Merikilpkonn roheline |
| # 348781 | Keskmine akvamariin |
| # 307D7E | Rohekassinine |
| # 5E7D7E | Hallikas türkiissinine |
| # 4C787E | Mardikas roheline |
| # 008080 | Teal |
| # 4E8975 | Mereroheline |
| # 78866B | Kamuflaaž roheline |
| # 848b79 | Salvei roheline |
| # 617C58 | Sarapuu roheline |
| # 728C00 | Mürk roheline |
| # 667C26 | Sõnajalg roheline |
| # 254117 | Tume metsa roheline |
| # 306754 | Keskmise mere roheline |
| # 347235 | Keskmine metsa roheline |
| # 437C17 | Merevetikad rohelised |
| # 387C44 | Männiroheline |
| # 347C2C | Džungelroheline |
| # 347C17 | Shamrock Green |
| # 348017 | Keskmine kevadine roheline |
| # 4E9258 | Metsaroheline |
| # 6AA121 | Roheline sibul |
| # 4AA02C | Kevadine roheline |
| # 41A317 | Laimiroheline |
| # 3EA055 | Ristikhein |
| # 6CBB3C | Roheline madu |
| # 6CC417 | Tulnukas roheline |
| # 4CC417 | Roheline õun |
| # 52D017 | Kollane roheline |
| # 4CC552 | Kelly Green |
| # 54C571 | Zombi roheline |
| # 99C68E | Konn roheline |
| # 89C35C | Rohelised herned |
| # 85BB65 | Dollar Bill Green |
| # 8BB381 | Tume meri roheline |
| # 9CB071 | Iguana roheline |
| # B2C248 | Avokaado roheline |
| # 9DC209 | Pistaatsiaroheline |
| # A1C935 | Salat roheline |
| # 7FE817 | Kolibri roheline |
| # 59E817 | Nebula roheline |
| # 57E964 | Suunatuli roheline |
| # 64E986 | Vetikad rohelised |
| # 5EFB6E | Jade Green |
| # 00FF00 | Roheline |
| # 5FFB17 | Smaragd roheline |
| # 87F717 | Muru roheline |
| # 8AFB17 | Chartreuse |
| # 6AFB92 | Draakoni roheline |
| # 98FF98 | Rahapaja roheline |
| # B5EAAA | Roheline pöial |
| # C3FDB8 | Hele jade |
| # CCFB5D | Tee roheline |
| # B1FB17 | Roheline kollane |
| # BCE954 | Lima roheline |
| # EDDA74 | Goldenrod |
| # EDE275 | Saagi kuld |
| # FFE87C | Päike kollane |
4. Kollane HTML värvinimi
Kollase saab kasutada mitte-tõsise meeleolu seadmiseks, loovuse ja optimismi kuvamiseks lehel. Pidage meeles, et kollane toimib taustana paremini kui teksti värv.
| # FFFF00 | Kollane |
| # FFF380 | Maisi kollane |
| # FFFFC2 | Pärgament |
| #FFFFCC | Kreem |
| # FFF8C6 | Sidrun šifoon |
| # FFF8DC | Cornsilk |
| # F5F5DC | Beež |
| # FBF6D9 | Blond |
| # FAEBD7 | Antiikvalge |
| # F7E7CE | Šampanja |
| #FFEBCD | Blanšeeritud mandel |
| # F3E5AB | Vanilje |
| # ECE5B6 | Tan Brown |
| # FFE5B4 | Virsik |
| # FFDB58 | Sinep |
| # FFD801 | Kumm Kollane |
| # FDD017 | Hele kuld |
| # EAC117 | Kuldpruun |
| # F2BB66 | Makaronid ja juust |
| # FBB917 | Safran |
| # FBB117 | Õlu |
| # FFA62F | Kantaluup |
| # E9AB17 | Mesilaskollane |
5. Pruunid HTML-värvid
Pruun taust võib muuta valge või musta teksti lugemise keeruliseks. Võite kasutada teisi värve, millel on pruuni varjundiga võrreldes hea kontrast.
| # E2A76F | Pruun suhkur |
| # DEB887 | BurlyWood |
| # FFCBA4 | Sügav virsik |
| # C9BE62 | Ingver Brown |
| # E8A317 | Koolibuss kollane |
| # EE9A4D | Sandy Brown |
| # C8B560 | Sügisleht Brown |
| # D4A017 | Oranž kuld |
| # C2B280 | Liiv |
| # C7A317 | Präänik pruun |
| # C68E17 | Karamell |
| # B5A642 | Messing |
| # ADA96E | Khaki |
| # C19A6B | Kaamel pruun |
| # CD7F32 | Pronks |
| # C88141 | Tiigeroranž |
| # C58917 | Kaneel |
| # AF9B60 | Bullet Shell |
| # AF7817 | Tume Goldenrod |
| # B87333 | Vask |
| # 966F33 | Puit |
| # 806517 | Tamm Brown |
| # 827839 | Mokassiin |
| # 827B60 | Armee pruun |
| # 786D5F | Liivakivi |
| # 493D26 | Mocha |
| # 483C32 | Taupe |
| # 6F4E37 | Kohv |
| # 835C3B | Pruunkaru |
| # 7F5217 | Punane mustus |
| # 7F462C | Seepia |
6. Oranžid HTML-värvid
Oranž sobib suurepäraselt, et esile tuua punkt, kui värvi kasutatakse taustana, ja see võib esile kutsuda entusiasmi ja soojust, ilma et see oleks liiga kleepuv.6. Oranžid HTML-värvid
| # C47451 | Apelsini lõhe |
| # C36241 | Rooste |
| # C35817 | Punane rebane |
| # C85A17 | Šokolaad |
| # CC6600 | Sedona |
| # E56717 | Papaia apelsin |
| # E66C2C | Halloweeni apelsin |
| # F87217 | Pumpkin Orange |
| # F87431 | Ehituskoonusoranž |
| # E67451 | Päikesetõusu oranž |
| # FF8040 | Mango apelsin |
| # F88017 | Tumeoranž |
| # FF7F50 | Korall |
| # F88158 | Korvpall Oranž |
| # F9966B | Kerge lõhe |
| # E78A61 | Tangeriin |
| # E18B6B | Tume lõhe |
| # E77471 | Hele korall |
| # F75D59 | Bean Red |
| # E55451 | Valentine Red |
| # E55B3C | Šokeeriv oranž |
7. Punased HTML-värvikoodid
Mõne brauseri puhul kasutatakse punaste allajoonitud teksti külastatud linkidena, peaksite vältima selle kasutamist, et külastajaid mitte segadusse ajada.
| # FF0000 | Punane |
| # FF2400 | Scarlet |
| # F62217 | Rubiinpunane |
| # F70D1A | Ferrari punane |
| # F62817 | Tuletõrjeauto punane |
| # E42217 | Laavapunane |
| # E41B17 | Armastan punast |
| # DC381F | Greip |
| # C34A2C | Kastanipunane |
| # C24641 | Kirsipunane |
| # C04000 | Mahagon |
| # C11B17 | Tšillipipar |
| # 9F000F | Jõhvikas |
| # 990012 | Punane vein |
| # 8C001A | Burgundia |
| # 954535 | kastan |
| # 7E3517 | Verepunane |
| # 8A4117 | Sienna |
| # 7E3817 | Sangria |
| # 800517 | Firebrick |
| # 810541 | Maroon |
| # 7D0541 | Ploomipirukas |
| # 7E354D | Velvet Maroon |
| # 7D0552 | Ploom samet |
| # 7F4E52 | Rosy Finch |
| # 7F5A58 | Paas |
| # 7F525D | Tuhm lilla |
| # B38481 | Rosy Brown |
| # C5908E | Khaki Rose |
8. Roosad HTML-värvikoodid
Värviteaduse kohaselt saab Roosa ja selle toone kasutada juhul, kui soovite, et külastajal oleks alateadvuses enesekindlus, rafineeritus ja soojus.
| # C48189 | Roosa vibu |
| # C48793 | Huulepulk roosa |
| # E8ADAA | Roos |
| # ECC5C0 | Roosikuld |
| # EDC9AF | Kõrbe liiv |
| # FDD7E4 | Siga roosa |
| #FCDFFF | Suhkruvatt |
| #FFDFDD | Roosa mullikummi |
| # FBBBB9 | Udune roos |
| #FAAFBE | Roosa |
| #FAAFBA | Heleroosa |
| # F9A7B0 | Flamingo Pink |
| # E7A1B0 | Roosa roos |
| # E799A3 | Roosa Daisy |
| # E38AAE | Cadillac Pink |
| # F778A1 | Nelk roosa |
| # E56E94 | Põsepunane |
| # F660AB | Soe roosa |
| # FC6C85 | Arbuus Pink |
| # F6358A | Violetne Punane |
| # F52887 | Deep Pink |
| # E45E9D | Roosa tassikook |
| # E4287C | Roosa limonaad |
| # F535AA | Neoonroosa |
| # FF00FF | Magenta |
| # E3319D | Dimorphotheca Magenta |
| # F433FF | Hele neoonroosa |
| # D16587 | Kahvatu violetne punane |
| # C25A7C | Tulip Pink |
| # CA226B | Keskmine violetne punane |
| # C12869 | Rogue Pink |
| # C12267 | Põlenud roosa |
| # C25283 | Bashful Pink |
| # C12283 | Tume nelk roosa |
| # B93B8F | Ploom |
9. Lilla ja valge HTML-i värvikoodid
Valge teksti värvitooni kasutamine taustal muudab selle kasutajate jaoks loetamatuks ja lisaks sellele, et see pole kasutajasõbralik, võite oma saidi jaoks saada SEO-trahvi, seega kasutage alati valget ja muid heledaid värve tumeda taustaga taustal.
| # 7E587E | Viola Lilla |
| # 571B7E | Lilla iiris |
| # 583759 | Ploomililla |
| # 4B0082 | Indigo |
| # 461B7E | Lilla koletis |
| # 4E387E | Lilla Vine |
| # 614051 | Baklažaan |
| # 5E5A80 | Viinamarja |
| # 6A287E | Lilla moos |
| # 7D1B7E | Tume orhidee |
| # A74AC7 | Lilla lill |
| # B048B5 | Keskmine orhidee |
| # 6C2DC7 | Lilla ametüst |
| # 842DCE | Tume violetne |
| # 8D38C9 | violetne |
| # 7A5DC7 | Lilla salvei põõsas |
| # 7F38EC | Armas lilla |
| # 8E35EF | Lilla |
| # 893BFF | Asteekide lilla |
| # 8467D7 | Keskmine lilla |
| # A23BEC | Jasmiini lilla |
| # B041FF | Lilla nartsiss |
| # C45AEC | Tyriani lilla |
| # 9172EC | Krookuslilla |
| # 9E7BFF | Lilla Mimosa |
| # D462FF | Heliotroopne lilla |
| # E238EC | Karmiinpunane |
| # C38EC7 | Lilla draakon |
| # C8A2C8 | Lilla |
| # E6A9EC | Põsepuna roosa |
| # E0B0FF | Lilla |
| # C6AEC7 | Wisteria lilla |
| # F9B7FF | Õis roosa |
| # D2B9D3 | Ohakas |
| # E9CFEC | Periwinkle |
| # EBDDE2 | Lavendel Pinocchio |
| # E3E4FA | Lavendel sinine |
| # FDEEF4 | Pärl |
| # FFF5EE | SeaShell |
| #FEFCFF | Piimvalge |
| #FFFFFF | Valge |
Mõned enim kasutatud HTML-i värvikoodid
Need on mõned populaarsed värvid, mida veebis kasutatakse, olen need eraldi tabelisse pannud, et need kiiresti üles leida.
| Punane | # FF0000 | Valge | #FFFFFF |
| Tsüaan | # 00FFFF | Hõbe | # C0C0C0 |
| Sinine | # 0000FF | Hall või hall | # 808080 |
| Tumesinine | # 0000A0 | Must | # 000000 |
| Helesinine | # ADD8E6 | Oranž | # FFA500 |
| Lilla | # 800080 | Pruun | # A52A2A |
| Kollane | # FFFF00 | Maroon | # 800000 |
| Lubi | # 00FF00 | Roheline | # 008000 |
| Magenta | # FF00FF | Oliiv | # 808000 |
Järeldus
Nüüd, kui teil on tavaliste HTML-värvide kiirtabelid, peaksite saama oma lehel kasutada mis tahes värvi, mida soovite. Loomingulisest küljest peaksite vältima karmide värvide kasutamist, kui saate ja saidi esiotsaga töötades on korraliku kontrasti tagamiseks oluline ka taustgraafika või värvide hoidmine.
Soovitatavad artiklid
See on HTML-i värvinimede juhend. Siin arutatakse, kuidas rakendada värve veebilehel, kasutades erinevaid HTML-värve koos näidetega. Lisateavet leiate ka meie muudest soovitatud artiklitest -
- HTML-fontide stiilid
- HTML-atribuudid
- HTML-i stiililehed
- Kuidas HTML töötab
- Värvid Matlabis | Kuidas Matlabis stiili muuta?