Kod jorgovana. HTML vodič. RGB boje. Sigurna paleta boja. CSS boje - RGB vrijednosti
Tablica (paleta) boja html daje vam priliku da samostalno odaberete ton koji vam je potreban. Vrijednost boje prikazuje se u tri formata: Hex, RGB i HSV.
- Hex se sastoji od tri vrijednosti od dva znaka u heksadecimalnom brojevnom sustavu. Na primjer: #ff00b3, gdje je prvi par brojeva crven, drugi zelen, a treći plav.
- RGB (RedGreenBlue) ima oblik "200,100,255", označavajući količinu odgovarajućeg tona (crveno, zeleno, plavo) u rezultirajućoj boji.
- HSV (Hue, Saturation, Value - ton, zasićenost, vrijednost) - model boja u kojem su koordinate:
- Hue - ton boje, može varirati od 0° do 360°.
- Saturation - zasićenost, varira od 0-100 ili 0-1. Što je ovaj parametar veći, to je boja "čišća", zbog čega se ovaj parametar ponekad naziva čistoćom boje. I što je ovaj parametar bliži nuli, to je boja bliža neutralnoj sivoj.
- Vrijednost (vrijednost boje) - postavlja svjetlinu, vrijednost također može varirati između 0-100 ili 0-1.
Unesite kod boje: IĆI
Popis boja s nazivima
U tablici su navedeni engleski nazivi boja (koji se mogu koristiti kao vrijednosti) koje podržavaju svi preglednici i njihove heksadecimalne vrijednosti. Sve navedene boje su "sigurne", što znači da će se pojaviti jednako u svim preglednicima.
Naziv boje | HEX | Boja |
---|---|---|
Crno | #000000 | |
Mornarica | #000080 | |
Tamno plava | #00008B | |
Srednje plava | #0000CD | |
Plava | #0000FF | |
Tamnozelene | #006400 | |
zelena | #008000 | |
Teal | #008080 | |
tamnocijan | #008B8B | |
DeepSkyBlue | #00BFFF | |
Tamnotirkizna | #00CED1 | |
MediumSpringGreen | #00FA9A | |
Vapno | #00FF00 | |
SpringGreen | #00FF7F | |
Aqua | #00FFFF | |
cijan | #00FFFF | |
Ponoćnoplava | #191970 | |
Dodger Blue | #1E90FF | |
Svijetlosnozeleno | #20B2AA | |
ForestGreen | #228B22 | |
SeaGreen | #2E8B57 | |
DarkSlateGray | #2F4F4F | |
Limeta zelena | #32CD32 | |
MediumSeaGreen | #3CB371 | |
Tirkiz | #40E0D0 | |
Kraljevski plava | #4169E1 | |
SteelBlue | #4682B4 | |
DarkSlateBlue | #483D8B | |
SrednjeTirkizna | #48D1CC | |
Indigo | #4B0082 | |
TamnoMaslinastoZelena | #556B2F | |
Kadet Plavi | #5F9EA0 | |
CornflowerBlue | #6495ED | |
MediumAquaMarine | #66CDAA | |
DimGray | #696969 | |
Slate Blue | #6A5ACD | |
OliveDrab | #6B8E23 | |
Slate Gray | #708090 | |
LightSlateGray | #778899 | |
MediumSlateBlue | #7B68EE | |
LawnGreen | #7CFC00 | |
Chartreuse | #7FFF00 | |
Akvamarin | #7FFFD4 | |
Kesten | #800000 | |
Ljubičasta | #800080 | |
Maslina | #808000 | |
Sivo | #808080 | |
Plavo nebo | #87CEEB | |
Svijetlonebeskoplavo | #87CEFA | |
BlueViolet | #8A2BE2 | |
Tamno crvena | #8B0000 | |
tamnomagenta | #8B008B | |
SaddleBrown | #8B4513 | |
DarkSeaGreen | #8FBC8F | |
Svijetlozelena | #90EE90 | |
Srednjeljubičasta | #9370D8 | |
tamnoljubičasta | #9400D3 | |
Blijedozeleno | #98FB98 | |
DarkOrchid | #9932CC | |
Žutozeleno | #9ACD32 | |
Sienna | #A0522D | |
Smeđa | #A52A2A | |
Tamno sivo | #A9A9A9 | |
Svijetlo plava | #ADD8E6 | |
ZelenoŽuto | #ADFF2F | |
BlijedoTirkizna | #AFEEEE | |
Svijetločeličnoplava | #B0C4DE | |
PowderBlue | #B0E0E6 | |
Vatrostalna opeka | #B22222 | |
DarkGoldenRod | #B8860B | |
Srednja orhideja | #BA55D3 | |
RosyBrown | #BC8F8F | |
Tamni kaki | #BDB76B | |
Srebro | #C0C0C0 | |
Srednje LjubičastoCrveno | #C71585 | |
IndijskoCrveno | #CD5C5C | |
Peru | #CD853F | |
Čokolada | #D2691E | |
Tan | #D2B48C | |
Svijetlo siva | #D3D3D3 | |
Blijedoljubičastocrveno | #D87093 | |
čičak | #D8BFD8 | |
Orhideja | #DA70D6 | |
GoldenRod | #DAA520 | |
Grimizna | #DC143C | |
Gainsboro | #DCDCDC | |
Šljiva | #DDA0DD | |
BurlyWood | #DEB887 | |
Svijetlocijan | #E0FFFF | |
Lavanda | #E6E6FA | |
DarkSalmon | #E9967A | |
ljubičica | #EE82EE | |
PaleGoldenRod | #EEE8AA | |
LightCoral | #F08080 | |
Kaki | #F0E68C | |
AliceBlue | #F0F8FF | |
Medljika | #F0FFF0 | |
Azurno | #F0FFFF | |
SandyBrown | #F4A460 | |
Pšenica | #F5DEB3 | |
Bež | #F5F5DC | |
WhiteSmoke | #F5F5F5 | |
Krema od mente | #F5FFFA | |
GhostWhite | #F8F8FF | |
Losos | #FA8072 | |
AntiqueWhite | #FAEBD7 | |
Posteljina | #FAF0E6 | |
SvijetloZlatnaŠtapŽuta | #FAFAD2 | |
Stara Čipka | #FDF5E6 | |
Crvena | #FF0000 | |
Fuksija | #FF00FF | |
Magenta | #FF00FF | |
DeepPink | #FF1493 | |
NarančastoCrvena | #FF4500 | |
Rajčica | #FF6347 | |
HotPink | #FF69B4 | |
Koraljni | #FF7F50 | |
tamnonarančasta | #FF8C00 | |
LightSalmon | #FFA07A | |
naranča | #FFA500 | |
Svijetloružičasta | #FFB6C1 | |
Ružičasta | #FFC0CB | |
Zlato | #FFD700 | |
PeachPuff | #FFDAB9 | |
NavajoBijela | #FFDEAD | |
Mokasina | #FFE4B5 | |
Čorba | #FFE4C4 | |
MistyRose | #FFE4E1 | |
Blanširani badem | #FFEBCD | |
Papaya Whip | #FFEFD5 | |
LavandaRumenilo | #FFF0F5 | |
Školjka | #FFF5EE | |
kukuruzna svila | #FFF8DC | |
LemonChiffon | #FFFACD | |
Cvjetnobijela | #FFFAF0 | |
Snijeg | #FFFAFA | |
Žuta boja | #FFFF00 | |
Svijetlo žuto | #FFFFE0 | |
Bjelokost | #FFFFFF0 | |
Bijela | #FFFFFF |
HTML boje su označene sa šest znakova nakon kose crte - na primjer, #000000. Ovih šest simbola predstavljaju omjere različitih boja (crvena, zelena, plava) u konačnoj boji. Na monitoru vašeg računala slika se sastoji od ogromnog broja točaka koje se nazivaju pikseli. Svaki piksel je mali izvor svjetla, nazovimo ga "svjetiljka", koja se pak sastoji od tri svjetiljke - crvene, zelene i plave. Smanjivanjem ili povećanjem intenziteta sjaja pojedinačnih svjetiljki u boji dobivamo željenu boju.
HTML kodovi boja
Boje u HTML-u predstavljene su heksadecimalnim (HEX) zapisom crvene, plave i zelene (RGB).
Najmanja vrijednost boje je 0 (heksadecimalno 00). Najveća vrijednost boje je 255 (hex FF).
Heksadecimalna vrijednost boje sastoji se od tri znamenke koje počinju znakom #.
Kodovi boja (značenja)
Boja | HEX kod | RGB kod |
---|---|---|
#000000 | rgb(0,0,0) | |
#FF0000 | rgb(255,0,0) | |
#00FF00 | rgb(0,255,0) | |
#0000FF | rgb(0,0,255) | |
#FFFF00 | rgb(255,255,0) | |
#00FFFF | rgb(0,255,255) | |
#FF00FF | rgb(255,0,255) | |
#C0C0C0 | rgb(192,192,192) | |
#FFFFFF | rgb(255,255,255) |
16 milijuna nijansi
Kombinacija crvene, plave i zelene s vrijednostima u rasponu od 0 do 255 za postotak svake boje daje ukupno preko 16 milijuna nijansi (256 x 256 x 256).
Većina modernih monitora može prikazati najmanje 16 384 različite nijanse (LCD monitori općenito mogu prikazati 262 tisuće 16 milijuna (ažurirano listopad 2013.) boje, a CRT monitori mogu prikazati praktički neograničen broj boja).
Tablica boja u nastavku prikazuje promjenu udjela crvene od 0 do 255 s nultim vrijednostima za plavu i zelenu:
Crvena | HEX kod | RGB kod |
---|---|---|
#000000 | rgb(0,0,0) | |
#080000 | rgb(8,0,0) | |
#100000 | rgb(16,0,0) | |
#180000 | rgb(24,0,0) | |
#200000 | rgb(32,0,0) | |
#280000 | rgb(40,0,0) | |
#300000 | rgb(48,0,0) | |
#380000 | rgb(56,0,0) | |
#400000 | rgb(64,0,0) | |
#480000 | rgb(72,0,0) | |
#500000 | rgb(80,0,0) | |
#580000 | rgb(88,0,0) | |
#600000 | rgb(96,0,0) | |
#680000 | rgb(104,0,0) | |
#700000 | rgb(112,0,0) | |
#780000 | rgb(120,0,0) | |
#800000 | rgb(128,0,0) | |
#880000 | rgb(136,0,0) | |
#900000 | rgb(144,0,0) | |
#980000 | rgb(152,0,0) | |
#A00000 | rgb(160,0,0) | |
#A80000 | rgb(168,0,0) | |
#B00000 | rgb(176,0,0) | |
#B80000 | rgb(184,0,0) | |
#C00000 | rgb(192,0,0) | |
#C80000 | rgb(200,0,0) | |
#D00000 | rgb(208,0,0) | |
#D80000 | rgb(216,0,0) | |
#E00000 | rgb(224,0,0) | |
#E80000 | rgb(232,0,0) | |
#F00000 | rgb(240,0,0) | |
#F80000 | rgb(248,0,0) | |
#FF0000 | rgb(255,0,0) |
Nijanse sive
Za dobivanje nijansi sive koriste se jednaki udjeli svih boja. Kako bismo vam olakšali odabir prave boje, nudimo vam kodove sivih nijansi
Nijanse sive | HEX kod | RGB kod |
---|---|---|
#000000 | rgb(0,0,0) | |
#080808 | rgb(8,8,8) | |
#101010 | rgb(16,16,16) | |
#181818 | rgb(24,24,24) | |
#202020 | rgb(32,32,32) | |
#282828 | rgb(40,40,40) | |
#303030 | rgb(48,48,48) | |
#383838 | rgb(56,56,56) | |
#404040 | rgb(64,64,64) | |
#484848 | rgb(72,72,72) | |
#505050 | rgb(80,80,80) | |
#585858 | rgb(88,88,88) | |
#606060 | rgb(96,96,96) | |
#686868 | rgb(104,104,104) | |
#707070 | rgb(112,112,112) | |
#787878 | rgb(120,120,120) | |
#808080 | rgb(128,128,128) | |
#888888 | rgb(136,136,136) | |
#909090 | rgb(144,144,144) | |
#989898 | rgb(152,152,152) | |
#A0A0A0 | rgb(160,160,160) | |
#A8A8A8 | rgb(168,168,168) | |
#B0B0B0 | rgb(176,176,176) | |
#B8B8B8 | rgb(184,184,184) | |
#C0C0C0 | rgb(192,192,192) | |
#C8C8C8 | rgb(200,200,200) | |
#D0D0D0 | rgb(208,208,208) | |
#D8D8D8 | rgb(216,216,216) | |
#E0E0E0 | rgb(224,224,224) | |
#E8E8E8 | rgb(232,232,232) | |
#F0F0F0 | rgb(240,240,240) | |
#F8F8F8 | rgb(248,248,248) | |
#FFFFFF | rgb(255,255,255) |
Nazivi html boja za više preglednika (svi preglednici).
Zbirka od 150 naziva boja u html-u, podržanih u svim preglednicima.
Standardizirani nazivi boja
W3C navodi 16 valjanih naziva boja za HTML i CSS: aqua, crna, plava, fuksija, siva, zelena, limeta, kestenjasta (kesten), tamnoplava (ultramarin), maslinasta (maslinasta), ljubičasta (ljubičasta), crvena (crvena) , srebrna (srebrna), plavozelena (siva), bijela (bijela) i žuta (žuta).
Kada koristite boje koje nisu uključene u ovaj popis, ispravnije je koristiti njihov heksadecimalni (HEX) kod ili RGB kod.
Sigurne boje
Prije nekoliko godina, kada su računala mogla podržavati maksimalno 256 različitih boja, predložen je popis od 216 "Web Safe Colors", s 40 boja rezerviranih za sustav.
Ova paleta od 216 boja stvorena je za ispravan prikaz boja u načinu rada s paletama od 256 boja.
Sada to nije važno jer većina računala diljem svijeta podržava milijune nijansi boja. U svakom slučaju, evo popisa ovih boja:
000000 | 000033 | 000066 | 000099 | 0000CC | 0000FF |
003300 | 003333 | 003366 | 003399 | 0033CC | 0033FF |
006600 | 006633 | 006666 | 006699 | 0066CC | 0066FF |
009900 | 009933 | 009966 | 009999 | 0099CC | 0099FF |
00CC00 | 00CC33 | 00CC66 | 00CC99 | 00CCCC | 00CCFF |
00FF00 | 00FF33 | 00FF66 | 00FF99 | 00FFCC | 00FFFF |
330000 | 330033 | 330066 | 330099 | 3300CC | 3300FF |
333300 | 333333 | 333366 | 333399 | 3333CC | 3333FF |
336600 | 336633 | 336666 | 336699 | 3366CC | 3366FF |
339900 | 339933 | 339966 | 339999 | 3399CC | 3399FF |
33CC00 | 33CC33 | 33CC66 | 33CC99 | 33CCCC | 33CCFF |
33FF00 | 33FF33 | 33FF66 | 33FF99 | 33FFCC | 33FFFF |
660000 | 660033 | 660066 | 660099 | 6600CC | 6600FF |
663300 | 663333 | 663366 | 663399 | 6633CC | 6633FF |
666600 | 666633 | 666666 | 666699 | 6666CC | 6666FF |
669900 | 669933 | 669966 | 669999 | 6699CC | 6699FF |
66CC00 | 66CC33 | 66CC66 | 66CC99 | 66CCCC | 66CCFF |
66FF00 | 66FF33 | 66FF66 | 66FF99 | 66FFCC | 66FFFF |
990000 | 990033 | 990066 | 990099 | 9900CC | 9900FF |
993300 | 993333 | 993366 | 993399 | 9933CC | 9933FF |
996600 | 996633 | 996666 | 996699 | 9966CC | 9966FF |
999900 | 999933 | 999966 | 999999 | 9999CC | 9999FF |
99CC00 | 99CC33 | 99CC66 | 99CC99 | 99CCCC | 99CCFF |
99FF00 | 99FF33 | 99FF66 | 99FF99 | 99FFCC | 99FFFF |
CC0000 | CC0033 | CC0066 | CC0099 | CC00CC | CC00FF |
CC3300 | CC3333 | CC3366 | CC3399 | CC33CC | CC33FF |
CC6600 | CC6633 | CC6666 | CC6699 | CC66CC | CC66FF |
CC9900 | CC9933 | CC9966 | CC9999 | CC99CC | CC99FF |
CCCC00 | CCCC33 | CCCC66 | CCCC99 | CCCCCC | CCCCFF |
CCFF00 | CCFF33 | CCFF66 | CCFF99 | CCFFCC | CCFFFF |
0000 FF | FF0033 | FF0066 | FF0099 | FF00CC | FF00FF |
FF3300 | FF3333 | FF3366 | FF3399 | FF33CC | FF33FF |
FF6600 | FF6633 | FF6666 | FF6699 | FF66CC | FF66FF |
9900 FF | FF9933 | FF9966 | FF9999 | FF99CC | FF99FF |
FFCC00 | FFCC33 | FFCC66 | FFCC99 | FFCCCC | FFCCFF |
FFFF00 | FFFF33 | FFFF66 | FFFF99 | FFFFCC | FFFFFF |
Za html stranice, boje su naznačene uglavnom u heksadecimalnom sustavu. Da biste to učinili, koriste se dvije vrste snimanja koda - puni ili skraćeni. Da biste pravilno označili html boju u cijelosti, trebate napisati šest znakova (brojeva i/ili engleskih slova) nakon oznake hash, na primjer, crna je napisana ovako: #000000. Skraćenica za određivanje html boja sastoji se od hasha i tri broja i/ili slova iza njega. Međutim, ova vrsta zaliha može se koristiti samo ako se cijeli zapis određene boje sastoji od identičnih simbola iza oznake hash. Na primjer, ista crna boja može se napisati ovako: #000. Možete odrediti html boje koristeći i velike i male znakove, budući da nisu osjetljivi na velika i mala slova.
Svaki znak napisan nakon "#" odgovara određenom omjeru crvene, zelene i plave boje. S druge strane, svi se monitori sastoje od ogromnog broja piksela (mikroskopskih točaka), od kojih svaki uključuje 3 takozvane "baterijske svjetiljke" (izvora svjetlosti): crvenu, zelenu i plavu. Zatim, podešavanjem intenziteta svjetla koje emitiraju te “baterijske svjetiljke”, monitor prikazuje boju koja nam je potrebna.
Kombinacijom intenziteta emisije crvene, plave i zelene svjetlosti (od 0 do 256), monitori mogu prikazati 16.000.000 različitih nijansi.
Također, boje za web stranice mogu se naznačiti verbalno ili u RGB kodu.
Danas se usmeno može napisati 147 boja. Važno je znati da neki različiti nazivi mogu značiti iste boje, na primjer Gray i Gray su siva boja (#808080).
Sigurne boje za web stranice.
Ne može svaki monitor i preglednik ispravno prikazati svih 16 milijuna html boja.
Ako, primjerice, naiđete na boju koju preglednik ne može ispravno prikazati, tada:
- Preglednik ga zamjenjuje onim koji mu je najsličniji i koji se može uspješno reproducirati;
- Za ispravan prikaz preglednik može miješati nekoliko boja i reproducirati rezultat.
Kako biste osigurali da ispis u bilo kojem pregledniku i na bilo kojem monitoru bude boja koju ste naveli u kodu, preporuča se koristiti "Sigurne boje". Određeni su ne ručno ili po tuđoj želji, već matematički. Postoji 216 takvih 100% sigurnih boja za HTML dokumente. I premda su današnje tehnologije dosegle točku u kojoj moderni monitori i preglednici prepoznaju milijune nijansi, preporučujemo korištenje ovih sigurnih boja kako bi se jamčilo iskazivanje boja.
Heksadecimalni sustav boja. | Kodovi boja u RGB (crvena, zelena, plava). |
HTML kod boje: #000000 | RGB boja: 0 0 0 |
HTML kod boje: #333333 | RGB boja: 51 51 51 |
HTML kod boje: #666666 | RGB boja: 102 102 102 |
HTML kod boje: #999999 | RGB boja: 153 153 153 |
HTML kod boje: #CCCCCC | RGB boja: 204 204 204 |
HTML kod boje: #FFFFFF | RGB boja: 255 255 255 |
HTML kod boje: #666600 | RGB boja: 102 102 0 |
HTML kod boje: #999900 | RGB boja: 153 153 0 |
HTML kod boje: #999933 | RGB boja: 153 153 51 |
HTML kod boje: #999966 | RGB boja: 153 153 102 |
HTML kod boje: #CCCC33 | RGB boja: 204 204 51 |
HTML kod boje: #CCCC66 | RGB boja: 204 204 102 |
HTML kod boje: #333300 | RGB boja: 51 51 0 |
HTML kod boje: #666633 | RGB boja: 102 102 51 |
HTML kod boje: #CCCC99 | RGB boja: 204 204 153 |
HTML kod boje: #CCFF33 | RGB boja: 204 255 51 |
HTML kod boje: #CCFF00 | RGB boja: 204 255 0 |
HTML kod boje: #CCFF66 | RGB boja: 204 255 102 |
HTML kod boje: #669900 | RGB boja: 102 153 0 |
HTML kod boje: #99CC33 | RGB boja: 153 204 51 |
HTML kod boje: #99CC00 | RGB boja: 153 204 0 |
HTML kod boje: #99CC66 | RGB boja: 153 204 102 |
HTML kod boje: #99FF33 | RGB boja: 153 255 51 |
HTML kod boje: #99FF00 | RGB boja: 153 255 0 |
HTML kod boje: #336600 | RGB boja: 51 102 0 |
HTML kod boje: #669933 | RGB boja: 102 153 51 |
HTML kod boje: #66CC33 | RGB boja: 102 204 51 |
HTML kod boje: #66CC00 | RGB boja: 102 204 0 |
HTML kod boje: #99FF66 | RGB boja: 153 255 102 |
HTML kod boje: #CCFF99 | RGB boja: 204 255 153 |
HTML kod boje: #009900 | RGB boja: 0 153 0 |
HTML kod boje: #339900 | RGB boja: 51 153 0 |
HTML kod boje: #33CC00 | RGB boja: 51 204 0 |
HTML kod boje: #33FF00 | RGB boja: 51 255 0 |
HTML kod boje: #66FF33 | RGB boja: 102 255 51 |
HTML kod boje: #66FF00 | RGB boja: 102 255 0 |
HTML kod boje: #00CC33 | RGB boja: 0 204 51 |
HTML kod boje: #33CC33 | RGB boja: 51 204 51 |
HTML kod boje: #00CC00 | RGB boja: 0 204 0 |
HTML kod boje: #00FF00 | RGB boja: 0 255 0 |
HTML kod boje: #00FF33 | RGB boja: 0 255 51 |
HTML kod boje: #33FF33 | RGB boja: 51 255 51 |
HTML kod boje: #003300 | RGB boja: 0 51 0 |
HTML kod boje: #336633 | RGB boja: 51 102 51 |
HTML kod boje: #669966 | RGB boja: 102 153 102 |
HTML kod boje: #66CC66 | RGB boja: 102 204 102 |
HTML kod boje: #99CC99 | RGB boja: 153 204 153 |
HTML kod boje: #CCFFCC | RGB boja: 204 255 204 |
HTML kod boje: #006600 | RGB boja: 0 102 0 |
HTML kod boje: #339933 | RGB boja: 51 153 51 |
HTML kod boje: #00FF66 | RGB boja: 0 255 102 |
HTML kod boje: #33FF66 | RGB boja: 51 255 102 |
HTML kod boje: #66FF66 | RGB boja: 102 255 102 |
HTML kod boje: #99FF99 | RGB boja: 153 255 153 |
HTML kod boje: #009933 | RGB boja: 0 153 51 |
HTML kod boje: #00CC66 | RGB boja: 0 204 102 |
HTML kod boje: #33CC66 | RGB boja: 51 204 102 |
HTML kod boje: #00FF99 | RGB boja: 0 255 153 |
HTML kod boje: #33FF99 | RGB boja: 51 255 153 |
HTML kod boje: #66FF99 | RGB boja: 102 255 153 |
HTML kod boje: #006633 | RGB boja: 0 102 51 |
HTML kod boje: #009966 | RGB boja: 0 153 102 |
HTML kod boje: #339966 | RGB boja: 51 153 102 |
HTML kod boje: #00CC99 | RGB boja: 0 204 153 |
HTML kod boje: #33CC99 | RGB boja: 51 204 153 |
HTML kod boje: #66CC99 | RGB boja: 102 204 153 |
HTML kod boje: #009999 | RGB boja: 0 153 153 |
HTML kod boje: #33CCCC | RGB boja: 51 204 204 |
HTML kod boje: #00FFCC | RGB boja: 0 255 204 |
HTML kod boje: #33FFCC | RGB boja: 51 255 204 |
HTML kod boje: #66FFCC | RGB boja: 102 255 204 |
HTML kod boje: #99FFCC | RGB boja: 153 255 204 |
HTML kod boje: #00CCCC | RGB boja: 0 204 204 |
HTML kod boje: #00FFFF | RGB boja: 0 255 255 |
HTML kod boje: #33FFFF | RGB boja: 51 255 255 |
HTML kod boje: #66FFFF | RGB boja: 102 255 255 |
HTML kod boje: #99FFFF | RGB boja: 153 255 255 |
HTML kod boje: #CCFFFF | RGB boja: 204 255 255 |
HTML kod boje: #336666 | RGB boja: 51 102 102 |
HTML kod boje: #006666 | RGB boja: 0 102 102 |
HTML kod boje: #669999 | RGB boja: 102 153 153 |
HTML kod boje: #339999 | RGB boja: 51 153 153 |
HTML kod boje: #66CCCC | RGB boja: 102 204 204 |
HTML kod boje: #99CCCC | RGB boja: 153 204 204 |
HTML kod boje: #003333 | RGB boja: 0 51 51 |
HTML kod boje: #0099CC | RGB boja: 0 153 204 |
HTML kod boje: #3399CC | RGB boja: 51 153 204 |
HTML kod boje: #00CCFF | RGB boja: 0 204 255 |
HTML kod boje: #33CCFF | RGB boja: 51 204 255 |
HTML kod boje: #66CCFF | RGB boja: 102 204 255 |
HTML kod boje: #006699 | RGB boja: 0 102 153 |
HTML kod boje: #336699 | RGB boja: 51 102 153 |
HTML kod boje: #6699CC | RGB boja: 102 153 204 |
HTML kod boje: #0099FF | RGB boja: 0 153 255 |
HTML kod boje: #3399FF | RGB boja: 51 153 255 |
HTML kod boje: #99CCFF | RGB boja: 153 204 255 |
HTML kod boje: #003366 | RGB boja: 0 51 102 |
HTML kod boje: #003399 | RGB boja: 0 51 153 |
HTML kod boje: #0033FF | RGB boja: 0 51 255 |
HTML kod boje: #3366CC | RGB boja: 51 102 204 |
HTML kod boje: #0066CC | RGB boja: 0 102 204 |
HTML kod boje: #0066FF | RGB boja: 0 102 255 |
HTML kod boje: #000033 | RGB boja: 0 0 51 |
HTML kod boje: #0033CC | RGB boja: 0 51 204 |
HTML kod boje: #0000CC | RGB boja: 0 0 204 |
HTML kod boje: #0000FF | RGB boja: 0 0 255 |
HTML kod boje: #3366FF | RGB boja: 51 102 255 |
HTML kod boje: #6699FF | RGB boja: 102 153 255 |
HTML kod boje: #000066 | RGB boja: 0 0 102 |
HTML kod boje: #000099 | RGB boja: 0 0 153 |
HTML kod boje: #3333CC | RGB boja: 51 51 204 |
HTML kod boje: #3300CC | RGB boja: 51 0 204 |
HTML kod boje: #3300FF | RGB boja: 51 0 255 |
HTML kod boje: #3333FF | RGB boja: 51 51 255 |
HTML kod boje: #333366 | RGB boja: 51 51 102 |
HTML kod boje: #333399 | RGB boja: 51 51 153 |
HTML kod boje: #666699 | RGB boja: 102 102 153 |
HTML kod boje: #6666CC | RGB boja: 102 102 204 |
HTML kod boje: #6666FF | RGB boja: 102 102 255 |
HTML kod boje: #9999CC | RGB boja: 153 153 204 |
HTML kod boje: #330066 | RGB boja: 51 0 102 |
HTML kod boje: #330099 | RGB boja: 51 0 153 |
HTML kod boje: #6600FF | RGB boja: 102 0 255 |
HTML kod boje: #6633FF | RGB boja: 102 51 255 |
HTML kod boje: #9999FF | RGB boja: 153 153 255 |
HTML kod boje: #CCCCFF | RGB boja: 204 204 255 |
HTML kod boje: #330033 | RGB boja: 51 0 51 |
HTML kod boje: #663399 | RGB boja: 102 51 153 |
HTML kod boje: #6633CC | RGB boja: 102 51 204 |
HTML kod boje: #6600CC | RGB boja: 102 0 204 |
HTML kod boje: #9966FF | RGB boja: 153 102 255 |
HTML kod boje: #9966CC | RGB boja: 153 102 204 |
HTML kod boje: #663366 | RGB boja: 102 51 102 |
HTML kod boje: #660099 | RGB boja: 102 0 153 |
HTML kod boje: #9900FF | RGB boja: 153 0 255 |
HTML kod boje: #9933FF | RGB boja: 153 51 255 |
HTML kod boje: #9933CC | RGB boja: 153 51 204 |
HTML kod boje: #CC99FF | RGB boja: 204 153 255 |
HTML kod boje: #660066 | RGB boja: 102 0 102 |
HTML kod boje: #996699 | RGB boja: 153 102 153 |
HTML kod boje: #9900CC | RGB boja: 153 0 204 |
HTML kod boje: #CC00FF | RGB boja: 204 0 255 |
HTML kod boje: #CC33FF | RGB boja: 204 51 255 |
HTML kod boje: #CC66FF | RGB boja: 204 102 255 |
HTML kod boje: #993399 | RGB boja: 153 51 153 |
HTML kod boje: #990099 | RGB boja: 153 0 153 |
HTML kod boje: #CC33CC | RGB boja: 204 51 204 |
HTML kod boje: #CC00CC | RGB boja: 204 0 204 |
HTML kod boje: #CC66CC | RGB boja: 204 102 204 |
HTML kod boje: #CC99CC | RGB boja: 204 153 204 |
HTML kod boje: #CC3399 | RGB boja: 204 51 153 |
HTML kod boje: #FF00FF | RGB boja: 255 0 255 |
HTML kod boje: #FF33FF | RGB boja: 255 51 255 |
HTML kod boje: #FF66FF | RGB boja: 255 102 255 |
HTML kod boje: #FF99FF | RGB boja: 255 153 255 |
HTML kod boje: #FFCCFF | RGB boja: 255 204 255 |
HTML kod boje: #990066 | RGB boja: 153 0 102 |
HTML kod boje: #CC0099 | RGB boja: 204 0 153 |
HTML kod boje: #CC6699 | RGB boja: 204 102 153 |
HTML kod boje: #FF33CC | RGB boja: 255 51 204 |
HTML kod boje: #FF00CC | RGB boja: 255 0 204 |
HTML kod boje: #FF66CC | RGB boja: 255 102 204 |
HTML kod boje: #660033 | RGB boja: 102 0 51 |
HTML kod boje: #993366 | RGB boja: 153 51 102 |
HTML kod boje: #CC0066 | RGB boja: 204 0 102 |
HTML kod boje: #FF0099 | RGB boja: 255 0 153 |
HTML kod boje: #FF3399 | RGB boja: 255 51 153 |
HTML kod boje: #FF99CC | RGB boja: 255 153 204 |
HTML kod boje: #663333 | RGB boja: 102 51 51 |
HTML kod boje: #996666 | RGB boja: 153 102 102 |
HTML kod boje: #CC3366 | RGB boja: 204 51 102 |
HTML kod boje: #FF0066 | RGB boja: 255 0 102 |
HTML kod boje: #FF3366 | RGB boja: 255 51 102 |
HTML kod boje: #FF6699 | RGB boja: 255 102 153 |
HTML kod boje: #330000 | RGB boja: 51 0 0 |
HTML kod boje: #990033 | RGB boja: 153 0 51 |
HTML kod boje: #993333 | RGB boja: 153 51 51 |
HTML kod boje: #CC3333 | RGB boja: 204 51 51 |
HTML kod boje: #CC6666 | RGB boja: 204 102 102 |
HTML kod boje: #CC9999 | RGB boja: 204 153 153 |
HTML kod boje: #CC0033 | RGB boja: 204 0 51 |
HTML kod boje: #FF0033 | RGB boja: 255 0 51 |
HTML kod boje: #FF3333 | RGB boja: 255 51 51 |
HTML kod boje: #FF6666 | RGB boja: 255 102 102 |
HTML kod boje: #FF9999 | RGB boja: 255 153 153 |
HTML kod boje: #FFCCCC | RGB boja: 255 204 204 |
HTML kod boje: #990000 | RGB boja: 153 0 0 |
HTML kod boje:#CC0000 | RGB boja: 204 0 0 |
HTML kod boje: #FF0000 | RGB boja: 255 0 0 |
HTML kod boje: #FF3300 | RGB boja: 255 51 0 |
HTML kod boje: #CC3300 | RGB boja: 204 51 0 |
HTML kod boje: #FF6633 | RGB boja: 255 102 51 |
HTML kod boje: #660000 | RGB boja: 102 0 0 |
HTML kod boje: #993300 | RGB boja: 153 51 0 |
HTML kod boje: #CC6633 | RGB boja: 204 102 51 |
HTML kod boje: #FF6600 | RGB boja: 255 102 0 |
HTML kod boje: #FF9966 | RGB boja: 255 153 102 |
HTML kod boje: #FFCC99 | RGB boja: 255 204 153 |
HTML kod boje: #663300 | RGB boja: 102 51 0 |
HTML kod boje: #996633 | RGB boja: 153 102 51 |
HTML kod boje: #CC6600 | RGB boja: 204 102 0 |
HTML kod boje: #CC9966 | RGB boja: 204 153 102 |
HTML kod boje: #FF9933 | RGB boja: 255 153 51 |
HTML kod boje: #FF9900 | RGB boja: 255 153 0 |
HTML kod boje: #996600 | RGB boja: 153 102 0 |
HTML kod boje: #CC9933 | RGB boja: 204 153 51 |
HTML kod boje: #CC9900 | RGB boja: 204 153 0 |
HTML kod boje: #FFCC33 | RGB boja: 255 204 51 |
HTML kod boje: #FFCC00 | RGB boja: 255 204 0 |
HTML kod boje: #FFCC66 | RGB boja: 255 204 102 |
HTML kod boje: #CCCC00 | RGB boja: 204 204 0 |
HTML kod boje: #FFFF00 | RGB boja: 255 255 0 |
HTML kod boje: #FFFF33 | RGB boja: 255 255 51 |
HTML kod boje: #FFFF66 | RGB boja: 255 255 102 |
HTML kod boje: #FFFF99 | RGB boja: 255 255 153 |
HTML kod boje: #FFFFCC | RGB boja: 255 255 204 |
Ova tablica uključuje 216 sigurnih html kodova boja. Svaka boja ima vrijednost u RGB za određivanje boje u grafičkim uređivačima i HEX za određivanje boje u html stranicama.
Za određivanje boja koriste se heksadecimalni brojevi. Heksadecimalni sustav, za razliku od decimalnog, temelji se, kao što mu i samo ime kaže, na broju 16. Brojevi će biti sljedeći: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A , B, C , D, E, F. Brojevi od 10 do 15 zamijenjeni su latiničnim slovima. Brojevi veći od 15 u heksadecimalnom sustavu nastaju spajanjem dva broja u jedan. Na primjer, broj 255 u decimali odgovara broju FF u heksadecimali. Kako bi se izbjegla zabuna pri određivanju brojevnog sustava, ispred heksadecimalnog broja stavlja se hash simbol #, na primjer #666999. Svaka od tri boje - crvena, zelena i plava - može imati vrijednosti od 00 do FF. Tako je simbol boje podijeljen na tri komponente #rrggbb, gdje prva dva simbola označavaju crvenu komponentu boje, srednja dva - zelenu, a posljednja dva - plavu. Dopušteno je koristiti skraćeni oblik #rgb, gdje svaki znak treba udvostručiti. Dakle, unos #fe0 treba smatrati #ffee00.
Imenom
Internet Explorer | Krom | Opera | Safari | Firefox | Android | iOS |
4.0+ | 1.0+ | 3.5+ | 1.3+ | 1.0+ | 1.0+ | 1.0+ |
Preglednici podržavaju neke boje prema njihovom nazivu. U tablici 1 prikazuje nazive, heksadecimalni kod, RGB, HSL vrijednosti i opis.
Ime | Boja | Kodirati | RGB | HSL | Opis |
---|---|---|---|---|---|
bijela | #ffffff ili #fff | rgb(255,255,255) | hsl(0,0%,100%) | Bijela | |
srebro | #c0c0c0 | rgb(192,192,192) | hsl(0,0%,75%) | Sivo | |
siva | #808080 | rgb(128,128,128) | hsl(0,0%,50%) | Tamno siva | |
crno | #000000 ili #000 | rgb(0,0,0) | hsl(0,0%,0%) | Crno | |
kesten | #800000 | rgb(128,0,0) | hsl(0,100%,25%) | Tamno crvena | |
Crvena | #ff0000 ili #f00 | rgb(255,0,0) | hsl(0,100%,50%) | Crvena | |
naranča | #ffa500 | rgb(255,165,0) | hsl(38,8,100%,50%) | naranča | |
žuta boja | #ffff00 ili #ff0 | rgb(255,255,0) | hsl(60,100%,50%) | Žuta boja | |
maslina | #808000 | rgb(128,128,0) | hsl(60,100%,25%) | Maslina | |
vapno | #00ff00 ili #0f0 | rgb(0,255,0) | hsl(120,100%,50%) | Svijetlo zelena | |
zelena | #008000 | rgb(0,128,0) | hsl(120,100%,25%) | zelena | |
aqua | #00ffff ili #0ff | rgb(0,255,255) | hsl(180,100%,50%) | Plava | |
plava | #0000ff ili #00f | rgb(0,0,255) | hsl(240,100%,50%) | Plava | |
mornarica | #000080 | rgb(0,0,128) | hsl(240,100%,25%) | Tamno plava | |
plavozelena | #008080 | rgb(0,128,128) | hsl(180,100%,25%) | Plavo zeleno | |
fuksija | #ff00ff ili #f0f | rgb(255,0,255) | hsl(300,100%,50%) | Ružičasta | |
ljubičasta | #800080 | rgb(128,0,128) | hsl(300,100%,25%) | ljubičica |
Korištenje RGB-a
Internet Explorer | Krom | Opera | Safari | Firefox | Android | iOS |
5.0+ | 1.0+ | 3.5+ | 1.3+ | 1.0+ | 1.0+ | 1.0+ |
Boju možete definirati pomoću vrijednosti crvene, zelene i plave u decimalnom obliku. Svaka od tri komponente boje ima vrijednost od 0 do 255. Također je dopušteno navesti boju kao postotak, pri čemu 100% odgovara broju 255. Prvo navedite ključnu riječ rgb, a zatim navedite komponente boje u zagradama , odvojene zarezima, na primjer rgb(255 , 128, 128) ili rgb(100%, 50%, 50%).
RGBA
Internet Explorer | Krom | Opera | Safari | Firefox | Android | iOS |
9.0+ | 1.0+ | 10.0+ | 3.1+ | 3.0+ | 2.1+ | 2.0+ |
Format RGBA sličan je sintaksi RGB-u, ali uključuje alfa kanal koji određuje prozirnost elementa. Vrijednost 0 je potpuno prozirna, 1 je neprozirna, a srednja vrijednost poput 0,5 je poluprozirna.
RGBA je dodan u CSS3, tako da se CSS kod mora provjeriti u odnosu na ovu verziju. Treba napomenuti da je standard CSS3 još uvijek u razvoju i da se neke značajke mogu promijeniti. Na primjer, boja u RGB formatu dodana svojstvu boje pozadine je potvrđena, ali ona dodana svojstvu pozadine više nije važeća. U isto vrijeme, preglednici sasvim ispravno razumiju boju za oba svojstva.
HSL
Internet Explorer | Krom | Opera | Safari | Firefox | Android | iOS |
9.0+ | 1.0+ | 9.6+ | 3.1+ | 3.0+ | 2.1+ | 2.0+ |
Naziv HSL formata izveden je iz kombinacije prvih slova Hue (boja), Saturate (zasićenost) i Lightness (svjetlina). Nijansa je vrijednost boje na kotaču boja (slika 1) i daje se u stupnjevima. 0° odgovara crvenoj, 120° zelenoj, a 240° plavoj boji. Vrijednost nijanse može varirati od 0 do 359.
Riža. 1. Kotačić boja
Zasićenost je intenzitet boje i mjeri se u postotku od 0% do 100%. Vrijednost od 0% označava odsustvo boje i nijansu sive, 100% je najveća vrijednost za zasićenost.
Svjetlina određuje koliko je boja svijetla i navedena je kao postotak od 0% do 100%. Niske vrijednosti čine boju tamnijom, a visoke vrijednosti čine boju svjetlijom; ekstremne vrijednosti od 0% i 100% odgovaraju crno-bijeloj boji.
HSLA
Internet Explorer | Krom | Opera | Safari | Firefox | Android | iOS |
9.0+ | 1.0+ | 10.0+ | 3.1+ | 3.0+ | 2.1+ | 2.0+ |
HSLA format sličan je sintaksi HSL-u, ali uključuje alfa kanal za određivanje transparentnosti elementa. Vrijednost 0 je potpuno prozirna, 1 je neprozirna, a srednja vrijednost poput 0,5 je poluprozirna.
Vrijednosti boja RGBA, HSL i HSLA dodane su u CSS3, stoga provjerite valjanost verzije koda kada koristite ove formate.
HTML5 CSS2.1 CSS3 IE Cr Op Sa Fx
Upozorenje
Sve metode hvatanja lavova navedene na stranici su teoretske i temeljene na računalnim metodama. Autori ne jamče vašu sigurnost prilikom korištenja i odriču se svake odgovornosti za rezultate. Zapamtite, lav je grabežljivac i opasna životinja!
Rezultat ovog primjera prikazan je na sl. 2.
Riža. 2. Boje na web stranici
Postoji nekoliko načina za predstavljanje boja u web dizajnu.
HEX je heksadecimalni sustav predstavljanja boja temeljen na bazi 16. Za ovaj sustav, arapske decimalne znamenke od 0 do 9 i latinična slova od A do F koriste se za dopunu digitalnog broja do 16. Za web dizajn, 16 primarnih (ključnih) boja koriste se tzv. heksadecimalni kod boja #RRGGBB, gdje je svaki par odgovoran za svoj udio u boji: RR – crvena, GG – zelena i BB – plava. Svaka frakcija boje je u rasponu od 00 do FF.
Druga dva prikaza boje u web dizajnu su: u obliku RGB(*,*,*), gdje je svaki “*” dio boje predstavljen decimalnim znamenkama od 0 do 255 i nazivima boja na engleskom jeziku.
Pri izradi slike u boji glavni problem je pravilna reprodukcija boja na različitim vrstama računala, monitora i preglednika. Ako preglednik ne može ispravno prikazati boju, odabire sličnu ili miješa nekoliko boja. A ponekad se može zamijeniti nekom sasvim drugom bojom.
Stol 16 osnovnih boja, koji se koriste u svim preglednicima
Ime | Boja | Hex | (RGB) |
Aqua (morski val) | #00FFFF | (000,255,255) | |
Crno | #000000 | (000,000,000) | |
Plava | #0000FF | (000,000,255) | |
Fuksija (magenta) | #FF00FF | (255,000,255) | |
Sivo | #808080 | (128,128,128) | |
zelena | #008000 | (000,128,000) | |
Limeta (svijetlo zelena) | #00FF00 | (000,255,000) | |
Kestenjasta (tamno bordo) | #800000 | (128,000,000) | |
Tamnoplava (tamnoplava) | #000080 | (000,000,128) | |
Maslina | #808000 | (128,128,000) | |
Ljubičasta | #800080 | (128,000,128) | |
Crvena | #FF0000 | (255,000,000) | |
Srebro | #C0C0C0 | (192,192,192) | |
Teal (sivo-zelena) | #008080 | (000,128,128) | |
Bijela | #FFFFFF | (255,255,255) | |
Žuta boja | #FFFF00 | (255,255,000) |
Stol ljubičasta boje i njegove nijanse
Ime | Boja | Hex | (RGB) |
magenta (magenta) | #FFCBDB | (255,203,219) | |
magenta (magenta) | #FF0099 | (255,000,153) | |
magenta (magenta) | #F95A61 | (249,090,097) | |
Fuksija (fuksija) | #FF00FF | (255,000,255) | |
Mauvein (anilin ljubičasta) | #EF0097 | (239,000,151) | |
Losos ružičasta (narančasto ružičasta) | #FF91A4 | (255,145,164) | |
Cenise (nijansa ljubičaste) | #DE3163 | (153,149,140) | |
Patlidžan (patlidžan) | #990066 | (153,000,132) | |
Rumenilo boje lavande (ružičasto-lavande) |  #FFF0F5 | (255,240,245) | |
Jorgovan (jorgovan) | #C8A2C8 | (200,162,200) | |
magenta (magenta) | #FF008F | (255,000,143) | |
Orhideja (orhideja) | #DA70D6 | (218,112,214) | |
Crveno-ljubičasta (ljubičasto-crvena) | #C71585 | (199,021,133) | |
sangvinik (sangvinik) | #92000A | (146,000,010) | |
Čičak (nijansa ljubičaste) | #D8BFD8 | (185,211,238) | |
Ljubičasto-patlidžan (nijansa ljubičaste) | #991199 | (153,017,153) | |
Rosa vivo (tamno ružičasta) | #FF007F | (255,000,127) | |
Lavanda-ruža (nijansa ljubičaste) | #FBA0E3 | (108,123,139) | |
Mountbatten ružičasta | #997ABD | (153,122,141) |
Stol siva boje i njegove nijanse
Ime | Boja | Hex | (RGB) |
Sivo | #808080 | (128,128,128) | |
Sivo | #bebebe | (190,190,190) | |
(Siva nijansa) | #858585 | (133,133,133) | |
Siva33 | #545454 | (084,084,084) | |
(Sivi škriljevac) | #708090 | (112,128,144) | |
(Kvarcni) | #99958s | (153,149,140) | |
(Svijetlo siva) | #bbbbbb | (187,187,187) | |
(Srebro) | #c0c0c0 | (192,192,192) | |
(Sivo-bijela) | #f0f0f0 | (240,240,240) | |
(Abdel-Kerimove brade) | #e0e0e0 | (224,224,224) | |
LightGray (svijetlo siva) | #d3d3d3 | (211,211,211) | |
LightStateGray() | #778899 | (119,136,153) | |
StateGray-1 (Blijedo različak plava 1) | #c6e2ff | (198,226,255) | |
StateGray-2 (Blijedo plava različak2) | #b9d3ee | (185,211,238) | |
StateGray3() | #9fb6cd | (159,182,205) | |
StateGray4() | #6c7b8b | (108,123,139) |