Uvod u nazive HTML boja
HTML nazivi boja pravilno su označeni u paragrafu. Boje su važne, ne samo što se koriste za ukrašavanje web stranice, već ćete u nekim slučajevima možda htjeti promijeniti boju teksta kako biste postigli bolji kontrast u odnosu na pozadinu stranice. S obzirom da je HTML napisan u tekstualnom obliku, ne možete samo obojati kôd po vašoj želji i očekivati da će web preglednik upotrijebiti istu boju prilikom prikazivanja stranice. Umjesto toga, morat ćete se poslužiti oznakama i atributima kako biste pretraživaču rekli koju boju koristiti.
Boje u HTML-u
U HTML imenima boja boje se mogu označiti uporabom njihove šesterostruke vrijednosti ili njezinog imena. HTML ima podršku za najčešće boje, u ovom ću članku podijeliti s vama 140 imena i heksna vrijednosti tih boja.
Jedna stvar treba imati na umu da se ne morate ograničavati na ove boje, možete koristiti bilo koji alat za odabir boja da biste pronašli Hex vrijednost bilo koje boje i koristili je na svojoj web stranici.
Korištenje HTML imena boja
Implementacija boja na vašoj web stranici je jednostavna i može se obaviti u liniji i pomoću posebnog CSS tablice.
Kad ćete na istoj stranici koristiti iste nazive HTML boja, bolje je koristiti CSS list za definiranje i postavljanje boja. Suprotno tome, ako boju morate koristiti samo jednom ili dvaput, korištenje metode ugrađenog smatra se boljom.
1. Korištenje HTML-a u boji
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. Implementacija u CSS-u
h1 ( color: Brown; )
p ( color: Gainsboro; )
Različita imena HTML boja
Sada kada znate što su nazivi HTML boja i kako ih možete koristiti na svojim stranicama, evo linka imena boja koje možete označiti i koristiti u svojim projektima:
1. Siva i crna imena HTML boja
Siva i crna boja su u većini slučajeva savršena za boju teksta na stranicama, a na bijeloj pozadini ove boje imaju najbolju čitljivost. Jedna zanimljiva stvar koju treba imati na umu jest da moderni telefoni s učinjenim OLED ekranima trebaju bilo kakvu snagu baterije za prikaz crne boje ako će vaša publika biti mobilna, pametno je koristiti crnu boju kao pozadinsku boju i bijelo ili drugo svjetlo boje kao boja prednjeg plana.
| Kodirati | Boja |
| # 000000 | Crno |
| # 0C090A | Noć |
| # 2C3539 | bronce |
| # 2B1B17 | Ponoć |
| # 34282C | drveni ugljen |
| # 25383C | Tamno škriljevo sivo |
| # 3B3131 | Ulje |
| # 413839 | Crna mačka |
| # 3D3C3A | iridijum |
| # 463E3F | Crna jegulja |
| # 4C4646 | Crna krava |
| # 504A4B | Sivi vuk |
| # 565051 | Vampir siva |
| # 5C5858 | Sivi dupin |
| # 625D5D | Carbon Grey |
| # 666362 | Pepeo siva |
| # 6D6968 | Oblačno siva |
| # 726E6D | Smokey Grey |
| # 736F6E | siva |
| # 837E7C | Granit |
| # 848482 | Bojni brod Sivi |
| # B6B6B4 | Sivi oblak |
| # D1D0CE | Siva guska |
| # E5E4E2 | Platina |
| # BCC6CC | Metalno srebro |
| # 98AFC7 | Plavo siva |
| # 6D7B8D | Svjetlo siva škriljevac |
| # 657383 | Skrivena siva |
| # 616D7E | Jet Grey |
2. Plava HTML imena boja
Plavi podvučeni tekst smatra se vezom jer je zadani stil veze za većinu web preglednika. Izbjegavajte upotrebu plave za sav tekst na stranici jer posjetitelji mogu pogrešiti zbog hiperveza.
| # 646D7E | Magla plava |
| # 566D7E | Mramorno plava |
| # 737CA1 | Škriljevca plava |
| # 4863A0 | Čelično plava boja |
| # 2B547E | Blue Jay |
| # 2B3856 | Tamno škriljevca plava |
| # 151B54 | Ponoćno plavo |
| # 000080 | Mornarsko plava |
| # 342D7E | Plavi kit |
| # 15317E | Lapis plava |
| # 151B8D | Traper tamnoplava |
| # 0000A0 | Zemljino plava |
| # 0020C2 | Kobalt plava |
| # 0041C2 | Blueberry Blue |
| # 2554C7 | Safirno plava |
| # 1569C7 | Plave oči |
| # 2B60DE | Kraljevski plava |
| # 1F45FC | Plava orhideja |
| # 6960EC | Plavi Lotus |
| # 736AFF | Svijetloplava škrlatna boja |
| # 357EC7 | Windows Blue |
| # 368BC1 | Ledeno plavi led |
| # 488AC7 | Svileno plava |
| # 3090C7 | Plavi bršljan |
| # 659EC7 | Plavi Koi |
| # 87AFC7 | Columbia Blue |
| # 95B9C7 | Baby Blue |
| # 728FCE | Svijetlo čelično plava |
| # 2B65EC | Ocean Blue |
| # 306EFF | Plava vrpca |
| # 157DEC | Plava haljina |
| # 1589FF | Dodger Blue |
| # 6495ED | Kukuruzno plava |
| # 6698FF | Plavo nebo |
| # 38ACEC | Leptir plava |
| # 56A5EC | santa leda |
| # 5CB3FF | Kristalno plava |
| # 3BB9FF | Duboko nebesko plava |
| # 79BAEC | Traper plava |
| # 82CAFA | Svjetlo nebesko plava |
| # 82CAFF | Dan nebesko plava |
| # A0CFEC | Traperice plave |
| # B7CEEC | Plavi anđeo |
| # B4CFEC | Pastelno plava |
| # C2DFFF | Morsko plava |
| # C6DEFF | Puder plava |
| #AFDCEC | Koraljno plava |
| #ADDFFF | Svijetlo plava |
| #BDEDFF | Robin jaje plavo |
| #CFECEC | Blijedoplava ljiljana |
| # E0FFFF | Svjetlo cijan |
| # EBF4FA | Voda |
| # F0F8FF | AliceBlue |
| # F0FFFF | plavetnilo |
| #CCFFFF | Lagana škriljevca |
| # 93FFE8 | Lagani akvamarin |
| # 9AFEFF | Električno plava |
| # 7FFFD4 | Akvamarin |
| # 00FFFF | Cijan ili Aqua |
| # 7DFDFE | Tron Blue |
| # 57FEFF | Plavi cirkon |
| # 8EEBEC | Plava laguna |
| # 50EBEC | Celeste |
| # 4EE2EC | Blue Diamond |
| # 81D8D0 | Tiffany Blue |
| # 92C7C7 | Cyan Opaque |
| # 77BFC7 | Plava Hosta |
| # 78C7C7 | Sjeverno svjetlo plavo |
| # 48CCCD | Srednje tirkizno |
| # 43C6DB | Tirkiz |
| # 46C7C7 | Meduza |
| # 7BCCB5 | Plavo zeleno |
3. Zelene HTML boje
Na web lokacijama vezanim za prirodu, novac, okoliš itd. Zelena može biti dobar izbor boje za upotrebu kao pozadine.
| # 43BFC7 | Maka plavo zelena |
| # 3EA99F | Svjetlo morsko zeleno |
| # 3B9C9C | Tamno tirkizno |
| # 438D80 | Morska kornjača zelena |
| # 348781 | Srednji akvamarin |
| # 307D7E | Zelenkasto plava |
| # 5E7D7E | Sivkasto tirkizno |
| # 4C787E | Buba zelena |
| # 008080 | grogotovac |
| # 4E8975 | Morsko zeleno |
| # 78866B | Kamuflažno zeleno |
| # 848b79 | Kadulja zelena |
| # 617C58 | Hazel Green |
| # 728C00 | Venom zelena |
| # 667C26 | Zelena paprat |
| # 254117 | Tamno šumsko zeleno |
| # 306754 | Srednje morsko zeleno |
| # 347235 | Srednje šumsko zeleno |
| # 437C17 | Morske alge zelene |
| # 387C44 | Pine Green |
| # 347C2C | Zelena džungla |
| # 347C17 | Shamrock Green |
| # 348017 | Srednje proljetno zeleno |
| # 4E9258 | Šumsko zeleno |
| # 6AA121 | Zeleni luk |
| # 4AA02C | Proljetno zeleno |
| # 41A317 | Limeta zelena |
| # 3EA055 | Djetelina zelena |
| # 6CBB3C | Zelena zmija |
| # 6CC417 | Alien Green |
| # 4CC417 | Zelena jabuka |
| # 52D017 | Žuto zelena |
| # 4CC552 | Kelly Green |
| # 54C571 | Zombie Green |
| # 99C68E | Žaba zelena |
| # 89C35C | Grašak |
| # 85BB65 | Dollar Bill Green |
| # 8BB381 | Tamno morsko zeleno |
| # 9CB071 | Iguana Green |
| # B2C248 | Avokado zeleni |
| # 9DC209 | Pistacija zelena |
| # A1C935 | Zelena salata |
| # 7FE817 | Hummingbird Green |
| # 59E817 | Maglina zelena |
| # 57E964 | Stoplight Go Green |
| # 64E986 | Alge Zelene |
| # 5EFB6E | Jade Green |
| # 00FF00 | zelena |
| # 5FFB17 | Smaragdno zeleno |
| # 87F717 | Lawn Green |
| # 8AFB17 | šartrez |
| # 6AFB92 | Dragon Green |
| # 98FF98 | menta zelena |
| # B5EAAA | Zeleni palac |
| # C3FDB8 | Svjetlost Jade |
| # CCFB5D | Čaj zeleni |
| # B1FB17 | Zeleno žuto |
| # BCE954 | Slime Green |
| # EDDA74 | goldenrod |
| # EDE275 | Žetveno zlato |
| # FFE87C | Sunčano žuto |
4. Nazivi žute HTML boje
Žuta se može koristiti za postavljanje neozbiljnog raspoloženja, pokazivanje kreativnosti i optimizma na stranici. Imajte na umu da žuta djeluje bolje kao pozadina nego boja teksta.
| # FFFF00 | Žuta boja |
| # FFF380 | Kukuruzno žuto |
| # FFFFC2 | Pergament |
| #FFFFCC | Krema |
| # FFF8C6 | Limun šifon |
| # FFF8DC | Cornsilk |
| # F5F5DC | Bež |
| # FBF6D9 | Plavuša |
| # FAEBD7 | AntiqueWhite |
| # F7E7CE | šampanjac |
| #FFEBCD | BlanchedAlmond |
| # F3E5AB | vanilija |
| # ECE5B6 | Tan smeđe |
| # FFE5B4 | Breskva |
| # FFDB58 | Senf |
| # FFD801 | Guma Ducky Yellow |
| # FDD017 | Svijetlo zlato |
| # EAC117 | zlatno smeđa |
| # F2BB66 | Makaroni i sir |
| # FBB917 | Šafran |
| # FBB117 | Pivo |
| # FFA62F | dinja |
| # E9AB17 | Pčela žuta |
5. Smeđe HTML boje
Smeđa pozadina može otežati čitanje bijelog ili crnog teksta, možete se poslužiti drugim bojama koje imaju dobar kontrast u odnosu na vašu nijansu smeđe.
| # E2A76F | Smeđi šećer |
| # DEB887 | BurlyWood |
| # FFCBA4 | Duboka breskva |
| # C9BE62 | Đumbir smeđi |
| # E8A317 | Školski autobus žuti |
| # EE9A4D | Sandy Brown |
| # C8B560 | Jesen lišće smeđi |
| # D4A017 | Narančasto zlato |
| # C2B280 | Pijesak |
| # C7A317 | Cookie Brown |
| # C68E17 | Karamela |
| # B5A642 | mesing |
| # ADA96E | boja zemlje |
| # C19A6B | Kamil smeđe |
| # CD7F32 | bronza |
| # C88141 | Tigrasta naranča |
| # C58917 | Cimet |
| # AF9B60 | Mekša školjka |
| # AF7817 | Tamni Goldenrod |
| # B87333 | Bakar |
| # 966F33 | Drvo |
| # 806517 | Hrast smeđi |
| # 827839 | moccasin |
| # 827B60 | Vojska smeđa |
| # 786D5F | pješčar |
| # 493D26 | Moka |
| # 483C32 | Tupe |
| # 6F4E37 | Kava |
| # 835C3B | Smeđi medvjed |
| # 7F5217 | Crvena prljavština |
| # 7F462C | Sepija |
6. Narančaste HTML boje
Narančasta odlično djeluje kako bi istaknula točku kada se boja koristi kao pozadina i može izazvati osjećaj entuzijazma i topline, a da pritom nije previše ljepljiv.6. Narančaste HTML boje
| # C47451 | Narančasti losos |
| # C36241 | hrđa |
| # C35817 | Crvena lisica |
| # C85A17 | Čokolada |
| # CC6600 | Sedona |
| # E56717 | Papaja naranča |
| # E66C2C | Noć vještica Narančasta |
| # F87217 | Bundeva naranča |
| # F87431 | Konus naranče za gradnju |
| # E67451 | Sunrise Narančasta |
| # FF8040 | Mango naranča |
| # F88017 | Tamno narančasta |
| # FF7F50 | Koraljni |
| # F88158 | Košarka narančasta |
| # F9966B | Lagani losos |
| # E78A61 | Mandarina |
| # E18B6B | Tamni losos |
| # E77471 | Lagani koralj |
| # F75D59 | Grah crveni |
| # E55451 | Valentine Red |
| # E55B3C | Šokantna narančasta |
7. Crveni HTML kodovi u boji
U nekim preglednicima crveni naglašeni tekst koristi se kao posjećene veze, trebali biste izbjegavati njegovo korištenje da ne biste zbunili posjetitelje.
| # FF0000 | Crvena |
| # FF2400 | ljubičastocrven |
| # F62217 | Ruby Red |
| # F70D1A | Ferrari Red |
| # F62817 | Vatrogasna crvena |
| # E42217 | Lava crvena |
| # E41B17 | Ljubav crvena |
| # DC381F | Grejp |
| # C34A2C | Kesten crveni |
| # C24641 | Trešnja crvena |
| # C04000 | Od mahagonija |
| # C11B17 | Čili paprika |
| # 9F000F | Brusnica |
| # 990012 | Crno vino |
| # 8C001A | burgundac |
| # 954535 | kesten |
| # 7E3517 | Krvavo crven |
| # 8A4117 | Siena |
| # 7E3817 | sangria |
| # 800517 | Vatrostalna opeka |
| # 810541 | Kesten |
| # 7D0541 | Pita od šljive |
| # 7E354D | Velvet Maroon |
| # 7D0552 | Plum Velvet |
| # 7F4E52 | Rosy Finch |
| # 7F5A58 | Puce |
| # 7F525D | Dosadno ljubičasta |
| # B38481 | Rosy Brown |
| # C5908E | Khaki Rose |
8. Ružičasti HTML kodovi u boji
Prema znanosti o boji, Pink i njegove nijanse mogu se koristiti ako želite da posjetitelj ima osjećaj samopouzdanja, profinjenosti i topline u svojoj podsvijesti.
| # C48189 | Ružičasti luk |
| # C48793 | Ruž za usne |
| # E8ADAA | Ruža |
| # ECC5C0 | Ružičasto zlatno |
| # EDC9AF | Pustinjski pijesak |
| # FDD7E4 | Svinja ružičasta |
| #FCDFFF | Pamučni bombon |
| #FFDFDD | Pink Gubble Gum |
| # FBBBB9 | Misty Rose |
| #FAAFBE | Ružičasta |
| #FAAFBA | Svijetlo ružičasta |
| # F9A7B0 | Flamingo ružičasta |
| # E7A1B0 | Ružičasta ruža |
| # E799A3 | Ružičasta tratinčica |
| # E38AAE | Cadillac Pink |
| # F778A1 | Karanfil ružičasta |
| # E56E94 | Crvenilo crveno |
| # F660AB | Vruća ružičasta |
| # FC6C85 | Lubenica ružičasta |
| # F6358A | Ljubičasta crvena |
| # F52887 | Duboka ružičasta |
| # E45E9D | Pink Cupcake |
| # E4287C | Ružičasta limunada |
| # F535AA | Neonska ružičasta |
| # FF00FF | purpurnocrven |
| # E3319D | Dimorphotheca Magenta |
| # F433FF | Svijetla neonska ružičasta |
| # D16587 | Blijedo ljubičasto crvena |
| # C25A7C | Tulip ružičasta |
| # CA226B | Srednje ljubičasto crvena |
| # C12869 | Rogue Pink |
| # C12267 | Izgarana ružičasta |
| # C25283 | Bashful Pink |
| # C12283 | Tamna karanfil ružičasta |
| # B93B8F | Šljiva |
9. Ljubičasti i bijeli HTML kodovi boja
Upotreba boje bijelog teksta na bijeloj pozadini učinit će je korisnicima nečitljivom, a osim što korisnik nije prijateljski, možete dobiti SEO kaznu za svoje web mjesto, stoga uvijek koristite bijele i druge svijetle boje na tamnim pozadinama.
| # 7E587E | Viola ljubičasta |
| # 571B7E | Ljubičasta Iris |
| # 583759 | Šljiva ljubičasta |
| # 4B0082 | Indigo |
| # 461B7E | Ljubičasto čudovište |
| # 4E387E | Ljubičasta izmaglica |
| # 614051 | Patlidžan |
| # 5E5A80 | zrno grožđa |
| # 6A287E | Ljubičasta marmelada |
| # 7D1B7E | Tamna orhideja |
| # A74AC7 | Ljubičasti cvijet |
| # B048B5 | Srednja orhideja |
| # 6C2DC7 | Ljubičasti ametist |
| # 842DCE | Tamno ljubičasta |
| # 8D38C9 | ljubičasta |
| # 7A5DC7 | Ljubičasti kaduljski grm |
| # 7F38EC | Ljubičasta ljubičasta |
| # 8E35EF | purpurna boja |
| # 893BFF | Aztech Purple |
| # 8467D7 | Srednje ljubičasta |
| # A23BEC | Jasmine Purple |
| # B041FF | Ljubičasti narcis |
| # C45AEC | Tyrian Purple |
| # 9172EC | Crocus Purple |
| # 9E7BFF | Ljubičasta Mimoza |
| # D462FF | Heliotrope ljubičasta |
| # E238EC | tamnocrven |
| # C38EC7 | Ljubičasti Zmaj |
| # C8A2C8 | Lila |
| # E6A9EC | Rumenilo ružičasto |
| # E0B0FF | svjetloljubičast |
| # C6AEC7 | Wisteria Purple |
| # F9B7FF | Cvjeta ružičasta |
| # D2B9D3 | čkalj |
| # E9CFEC | Zimzelen |
| # EBDDE2 | Pinokio lavande |
| # E3E4FA | Lavanda plava |
| # FDEEF4 | Biser |
| # FFF5EE | Školjka |
| #FEFCFF | Mliječno bijelo |
| #FFFFFF | bijela |
Neki od najčešće korištenih HTML kodova boja
Ovo su neke od popularnih boja koje se koriste na webu, stavio sam ih u zasebnu tablicu kako bi se ove brzo mogle pronaći.
| Crvena | # FF0000 | bijela | #FFFFFF |
| cijan | # 00FFFF | Srebro | # C0C0C0 |
| plava | # 0000FF | Siva ili siva | # 808080 |
| Tamno plava | # 0000A0 | Crno | # 000000 |
| Svijetlo plava | # ADD8E6 | naranča | # FFA500 |
| purpurna boja | # 800080 | smeđ | # A52A2A |
| Žuta boja | # FFFF00 | Kesten | # 800000 |
| Vapno | # 00FF00 | zelena | # 008000 |
| purpurnocrven | # FF00FF | Maslina | # 808000 |
Zaključak
Sada kada imate brze referentne tablice uobičajenih HTML boja, trebali biste moći koristiti bilo koju boju na vašoj stranici. S kreativnog stajališta, trebali biste izbjegavati oštre boje ako možete i kada radite s prednjim krajem web stranice, čuvanje pozadinske grafike ili boja također je važno kako biste osigurali odgovarajući kontrast.
Preporučeni članci
Ovo je vodič za nazive HTML boja. Ovdje smo raspravljali o tome kako implementirati boje na web stranicu koristeći različite HTML boje s primjerima. Možete i proći kroz naše druge predložene članke da biste saznali više -
- Stilovi HTML fontova
- HTML atributi
- Tablice stilova HTML
- Kako funkcionira HTML
- Boje u Matlabu | Kako promijeniti stil u Matlabu?