Ova stranica pruža tabelu s ključnim riječima koje se mogu koristiti za označavanje boja u jezicima za web razvoj kao što su HTML, CSS, JavaScript, Flash i još mnogo toga.
U starim specifikacijama koncerna WC3 bilo je napisano samo 16 ključnih riječi uz pomoć kojih su boje bile postavljene u HTML i CSS. U kasnijim, novijim specifikacijama, dodato je još 130 ključnih riječi koje označavaju nazive boja. U sljedećoj tabeli navedeni su nazivi boja, heksadecimalni i RGB kodovi kojima odgovaraju.
Prema CSS pravilima, imena boja ne razlikuju velika i mala slova. IndianRed i indianred unosi boja su ekvivalentni.
Također je vrijedno napomenuti da od 146 ključnih riječi u tabeli, zapravo ima manje boja u njoj. To je zato što neke ključne riječi znače istu boju. Dakle, nazivi Grey i Grey označavaju 50% sive sa kodom #808080, a riječ Magenta je sinonim za HTML boju Fuchsia, koja odgovara heksadecimalnom kodu #FF00FF. Također sinonimi su riječi Aqua i Cyan, odgovaraju kodu # 00FFFF.
|
|
Heksadecimalni brojevi se koriste za postavljanje boja. Heksadecimalni sistem, za razliku od decimalnog, zasnovan je, kao što mu ime kaže, na broju 16. Brojevi će biti sledeći: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9 , A, B, C , D, E, F. Brojevi od 10 do 15 zamjenjuju se latiničnim slovima. Brojevi veći od 15 u heksadecimalu formiraju se kombinovanjem dva broja u jedan. Na primjer, 255 decimala jednako je FF heksadecimalno. Da bi se izbjegla zabuna u definiciji brojevnog sistema, hash simbol # stavlja se ispred heksadecimalnog broja, na primjer # 666999. Svaka od tri boje - crvena, zelena i plava - može se kretati od 00 do FF. Dakle, oznaka boje je podijeljena na tri komponente #rrggbb, gdje prva dva znaka označavaju crvenu komponentu boje, dva srednja - zelenu, a zadnja dva - plavu. Dozvoljeno je koristiti skraćeni oblik kao što je #rgb, gdje svaki znak treba udvostručiti. Dakle, #fe0 unos treba tretirati kao #ffee00.
Po imenu
Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
4.0+ | 1.0+ | 3.5+ | 1.3+ | 1.0+ | 1.0+ | 1.0+ |
Pretraživači podržavaju neke boje po imenu. Table 1 prikazuje nazive, heksadecimalni kod, RGB, HSL vrijednosti i opis.
Ime | Boja | Šifra | RGB | Hsl | Opis |
---|---|---|---|---|---|
bijela | #fffff ili #fff | rgb (255,255,255) | hsl (0,0%, 100%) | Bijelo | |
srebro | # c0c0c0 | rgb (192.192.192) | hsl (0,0%, 75%) | Siva | |
siva | #808080 | rgb (128,128,128) | hsl (0,0%, 50%) | Tamno siva | |
crna | # 000000 ili # 000 | rgb (0,0,0) | hsl (0,0%, 0%) | Crno | |
maroon | #800000 | rgb (128,0,0) | hsl (0,100%, 25%) | Tamno crvena | |
crvena | # ff0000 ili # f00 | rgb (255,0,0) | hsl (0,100%, 50%) | Crveni | |
narandžasta | # ffa500 | rgb (255,165,0) | hsl (38,8,100%, 50%) | Narandžasta | |
žuta | # ffff00 ili # ff0 | rgb (255,255,0) | hsl (60,100%, 50%) | Žuta | |
maslina | #808000 | rgb (128,128,0) | hsl (60,100%, 25%) | Maslina | |
kreč | # 00ff00 ili # 0f0 | rgb (0.255.0) | hsl (120,100%, 50%) | Svijetlo zelena | |
zeleno | #008000 | rgb (0.128.0) | hsl (120,100%, 25%) | Zeleno | |
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%) | Mornarsko plava | |
teal | #008080 | rgb (0.128.128) | hsl (180,100%, 25%) | Plavo zeleno | |
fuksija | # ff00ff ili # f0f | rgb (255,0,255) | hsl (300,100%, 50%) | Pink | |
ljubičasta | #800080 | rgb (128,0,128) | hsl (300,100%, 25%) | Violet |
Sa RGB
Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
5.0+ | 1.0+ | 3.5+ | 1.3+ | 1.0+ | 1.0+ | 1.0+ |
Možete odrediti boju pomoću decimalnih vrijednosti crvene, zelene i plave komponente. Svaka od tri komponente boje ima vrijednost od 0 do 255. Dozvoljeno je i postavljanje boje kao postotak, dok će 100% odgovarati broju 255. Prvo je navedena ključna riječ rgb, a zatim u zagradi komponente boje su označene, odvojene zarezima, na primjer rgb (255, 128, 128) ili rgb (100%, 50%, 50%).
RGBA
Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
9.0+ | 1.0+ | 10.0+ | 3.1+ | 3.0+ | 2.1+ | 2.0+ |
RGBA format je po sintaksi sličan RGB-u, ali uključuje alfa kanal koji kontrolira transparentnost elementa. Vrijednost 0 odgovara punoj transparentnosti, 1 neprozirnosti, a srednja vrijednost poput 0,5 poluprozirnosti.
RGBA je dodat u CSS3, tako da bi valjanost CSS koda trebala biti obavljena pomoću ove verzije. Treba napomenuti da je CSS3 standard još uvijek u razvoju i da se neke karakteristike mogu promijeniti. Na primjer, RGB boja dodana svojstvu background-color je potvrđena, ali boja dodana svojstvu background-a više ne. Istovremeno, pretraživači sasvim ispravno razumiju boju za oba svojstva.
Hsl
Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
9.0+ | 1.0+ | 9.6+ | 3.1+ | 3.0+ | 2.1+ | 2.0+ |
Naziv HSL formata formiran je od kombinacije prvih slova Hue (nijansa), Saturate (zasićenost) i Lightness (svjetlina). Nijansa je vrednost boje na krugu boja (slika 1) i data je u stepenima. 0° je crvena, 120° je zelena, a 240° je plava. Vrijednost nijanse može biti u rasponu od 0 do 359.
Rice. 1. Točak boja
Zasićenost je intenzitet boje, mjeren u procentima od 0% do 100%. Vrijednost od 0% označava bez boje i nijansu sive, 100% je maksimalna vrijednost zasićenja.
Svjetlost postavlja koliko je svijetla boja i prikazuje se u procentima od 0% do 100%. Niske vrijednosti čine boju tamnijom, a visoke vrijednosti posvjetljuju, ekstremne vrijednosti od 0% i 100% odgovaraju crno-bijeloj.
HSLA
Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
9.0+ | 1.0+ | 10.0+ | 3.1+ | 3.0+ | 2.1+ | 2.0+ |
HSLA format je po sintaksi sličan HSL-u, ali uključuje alfa kanal koji postavlja transparentnost elementa. Vrijednost 0 odgovara punoj transparentnosti, 1 neprozirnosti, a srednja vrijednost poput 0,5 poluprozirnosti.
Vrijednosti boja u formatima RGBA, HSL i HSLA dodane su u CSS3, stoga provjerite valjanost verzije kada koristite ove formate.
HTML5 CSS2.1 CSS3 IE Cr Op Sa Fx
Upozorenje
Sve metode za hvatanje lava navedene na stranici su teorijske i bazirane na računskim metodama. Autori ne jamče vašu sigurnost kada ih koristite i odriču se bilo kakve odgovornosti za rezultat. Zapamtite, lav je grabežljivac i opasna životinja!
Rezultat ovog primjera prikazan je na sl. 2.
Rice. 2. Boje na web stranici
CSS modul boja detaljno opisuje vrijednosti koje omogućavaju autorima da definiraju boje i neprozirnost html elemenata, kao i vrijednosti svojstva boje.
Svojstvo boje
1. Prioritetne boje: svojstvo boje
Svojstvo postavlja boju fonta koristeći različite sisteme za prikazivanje boja. Svojstvo opisuje boju tekstualnog sadržaja elementa. Također se koristi za pružanje potencijalne indirektne vrijednosti (currentColor) za bilo koja druga svojstva koja prihvaćaju vrijednosti boja.
Imovina je naslijeđena.
2. Vrijednosti boja
2.1. Glavne ključne riječi
Lista glavnih ključnih riječi uključuje sljedeća značenja:
Ime | HEX | RGB | Boja |
---|---|---|---|
crna | #000000 | 0,0,0 | |
srebro | # C0C0C0 | 192,192,192 | |
siva | #808080 | 128,128,128 | |
bijela | #FFFFFF | 255,255,255 | |
maroon | #800000 | 128,0,0 | |
crvena | # FF0000 | 255,0,0 | |
ljubičasta | #800080 | 128,0,128 | |
fuksija | # FF00FF | 255,0,255 | |
zeleno | #008000 | 0,128,0 | |
kreč | # 00FF00 | 0,255,0 | |
maslina | #808000 | 128,128,0 | |
žuta | # FFFF00 | 255,255,0 | |
mornarica | #000080 | 0,0,128 | |
plava | # 0000FF | 0,0,255 | |
teal | #008080 | 0,128,128 | |
aqua | # 00FFFF | 0,255,255 |
Nazivi boja ne razlikuju velika i mala slova.
Sintaksa
Boja: teal;
2.2. Numeričke vrijednosti boja
2.2.1. RGB boje
RGB heksadecimalni format vrijednosti je znak # odmah iza kojeg slijede tri ili šest heksadecimalnih znakova. Trocifreni RGB #rgb se pretvara u šestocifreni #rrggbb kopiranjem cifara umjesto dodavanjem nula. Na primjer, # fb0 se proširuje na # ffbb00. Ovo osigurava da se bijela #ffffff može specificirati u kratkom #fff i uklanja sve ovisnosti o dubini boje s prikaza.
Format RGB vrijednosti u funkcionalnoj notaciji je rgb (praćen zarezom razdvojenom listom od tri numeričke vrijednosti (bilo tri vrijednosti cijelog broja ili vrijednosti od tri posto) nakon čega slijedi znak). Cjelobrojna vrijednost 255 odgovara 100% i F ili FF u heksadecimalnom zapisu:
Rgb (255,255,255) = rgb (100%, 100%, 100%) = #FFF
Znakovi za razmak su dozvoljeni oko numeričkih vrijednosti.
Postoji nekoliko načina za predstavljanje boja u web dizajnu.
HEX je osnovni heksadecimalni sistem predstavljanja boja od 16. Za ovaj sistem se koriste arapske decimalne cifre od 0 do 9 i latinična slova od A do F za dopunu digitalnog broja do 16. Za web dizajn se uzima 16 osnovnih (ključnih) boja , takozvani heksadecimalni kod boje #RRGGBB, gdje je svaki par odgovoran za svoj udio u boji: RR - crvena, GG - zelena i BB - plava. Svaka frakcija boje kreće se od 00 do FF.
Druga dva prikaza boje u web dizajnu su: u obliku RGB (*, *, *), gdje je svaki dio boje "*" predstavljen decimalnim ciframa od 0 do 255 i nazivima boja na engleskom.
Prilikom kreiranja slike u boji, glavni problem je ispravan prikaz boja na različitim tipovima računara, monitora i pretraživača. Ako preglednik ne može ispravno prikazati boju, tada bira sličnu ili miješa nekoliko boja. A ponekad se može zamijeniti nekom potpuno drugom bojom.
sto 16 osnovnih boja koji se koriste u svim pretraživačima
Ime | Boja | Hex | (RGB) |
Aqua (morski val) | # 00FFFF | (000,255,255) | |
crna (crna) | #000000 | (000,000,000) | |
Plava | # 0000FF | (000,000,255) | |
fuksija (fuksin) | # FF00FF | (255,000,255) | |
siva (siva) | #808080 | (128,128,128) | |
zelena (zelena) | #008000 | (000,128,000) | |
Limeta (jarko zelena) | # 00FF00 | (000,255,000) | |
kestenjasta (kestenjasta) | #800000 | (128,000,000) | |
mornarsko plava (teget) | #000080 | (000,000,128) | |
maslina (maslina) | #808000 | (128,128,000) | |
Ljubičasta | #800080 | (128,000,128) | |
crvena (crvena) | # FF0000 | (255,000,000) | |
srebro (srebro) | # C0C0C0 | (192,192,192) | |
Teal (sivo-zelena) | #008080 | (000,128,128) | |
bijela (bijela) | #FFFFFF | (255,255,255) | |
žuta (žuta) | # FFFF00 | (255,255,000) |
sto ljubičasta boje i 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) | |
Movein (anilin ljubičasta) | # EF0097 | (239,000,151) | |
Losos roze (narandžasto roze) | # FF91A4 | (255,145,164) | |
Ceniz (nijansa magenta) | # DE3163 | (153,149,140) | |
Patlidžan Patlidžan (patlidžan) | #990066 | (153,000,132) | |
Rumenilo od lavande (ružičasta lavanda) | & nbsp # 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 | # C71585 | (199,021,133) | |
sangvinik (sangvinik) | # 92000A | (146,000,010) | |
čičak (nijansa magenta) | # 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 pink | # 997ABD | (153,122,141) |
sto siva boje i nijanse
Ime | Boja | Hex | (RGB) |
siva | #808080 | (128,128,128) | |
siva | #bebebe | (190,190,190) | |
(siva nijansa) | #858585 | (133,133,133) | |
Siva33 (Siva-33) | #545454 | (084,084,084) | |
(sivi škriljevci) | #708090 | (112,128,144) | |
(kvarc) | # 99958s | (153,149,140) | |
(Svijetlo siva) | #bbbbbb | (187,187,187) | |
(srebro) | # c0c0c0 | (192,192,192) | |
(sivo-bijelo) | # f0f0f0 | (240,240,240) | |
(Abdel-Kerimove brade) | # e0e0e0 | (224,224,224) | |
svjetlosiva (svijetlo siva) | # d3d3d3 | (211,211,211) | |
LightStateGray () | #778899 | (119,136,153) | |
StateGray-1 (Blijedo plavi različak1) | # c6e2ff | (198,226,255) | |
StateGray-2 (Blijedo plavi različak2) | # b9d3ee | (185,211,238) | |
StateGray3 () | # 9fb6cd | (159,182,205) | |
StateGray4 () | # 6c7b8b | (108,123,139) |
Tablica (paleta) html boja daje vam mogućnost da samostalno odaberete ton koji vam je potreban. Vrijednost boje se prikazuje u tri formata: Hex, RGB i HSV.
- Hex se sastoji od tri vrijednosti dva znaka u heksadecimalnom zapisu. Na primjer: # ff00b3, gdje je prvi par brojeva crven, drugi zelen, a treći plavi.
- RGB (RedGreenBlue) ima oblik "200,100,255" koji označava količinu odgovarajućeg tona (crvena, zelena, plava) u rezultujućoj boji.
- HSV (Hue, Saturation, Value - nijansa, zasićenost, vrijednost) - model boja, u kojem su koordinate:
- Hue - nijansa, može varirati od 0° do 360°.
- Zasićenje - zasićenje, kreće se od 0-100 ili 0-1. Što je ovaj parametar veći, to je boja "čistija", zbog čega se ovaj parametar ponekad naziva čistoća boje. I što je ovaj parametar bliži nuli, to je boja bliža neutralno sivoj.
- Vrijednost (vrijednost boje) - postavlja svjetlinu, vrijednost također može varirati između 0-100 ili 0-1.
Unesite kod boje: Idi
Lista boja sa nazivima
Tabela navodi engleske nazive boja (koji se mogu koristiti kao vrijednosti) koje podržavaju svi pretraživači i njihove heksadecimalne vrijednosti. Sve navedene boje su "sigurne", odnosno biće iste prikazane u svim pretraživačima.
Naziv boje | HEX | Boja |
---|---|---|
Crno | #000000 | |
mornarica | #000080 | |
Tamno plava | # 00008B | |
Srednjeplava | # 0000CD | |
Plava | # 0000FF | |
Tamno zelena | #006400 | |
Zeleno | #008000 | |
Teal | #008080 | |
DarkCyan | # 008B8B | |
DeepSkyBlue | # 00BFFF | |
Tamnotirkizno | # 00CED1 | |
MediumSpringGreen | # 00FA9A | |
Lime | # 00FF00 | |
SpringGreen | # 00FF7F | |
Aqua | # 00FFFF | |
Cyan | # 00FFFF | |
MidnightBlue | #191970 | |
DodgerBlue | # 1E90FF | |
LightSeaGreen | # 20B2AA | |
ForestGreen | # 228B22 | |
Seagreen | # 2E8B57 | |
DarkSlateGray | # 2F4F4F | |
LimeGreen | # 32CD32 | |
MediumSeaGreen | # 3CB371 | |
Tirkizna | # 40E0D0 | |
RoyalBlue | # 4169E1 | |
SteelBlue | # 4682B4 | |
DarkSlateBlue | # 483D8B | |
MediumTurquoise | # 48D1CC | |
Indigo | # 4B0082 | |
DarkOliveGreen | # 556B2F | |
CadetBlue | # 5F9EA0 | |
CornflowerBlue | # 6495ED | |
MediumAquaMarine | # 66CDAA | |
DimGray | #696969 | |
SlateBlue | # 6A5ACD | |
OliveDrab | # 6B8E23 | |
SlateGray | #708090 | |
LightSlateGray | #778899 | |
MediumSlateBlue | # 7B68EE | |
LawnGreen | # 7CFC00 | |
Chartreuse | # 7FFF00 | |
Akvamarin | # 7FFFD4 | |
Maroon | #800000 | |
Ljubičasta | #800080 | |
Maslina | #808000 | |
siva | #808080 | |
Nebo plavo | # 87CEEB | |
LightSkyBlue | # 87CEFA | |
Blueviolet | # 8A2BE2 | |
Tamno crvena | # 8B0000 | |
DarkMagenta | # 8B008B | |
Saddlebrown | # 8B4513 | |
DarkSeaGreen | # 8FBC8F | |
LightGreen | # 90EE90 | |
Srednjeljubičasta | # 9370D8 | |
Darkviolet | # 9400D3 | |
Palegreen | # 98FB98 | |
DarkOrchid | # 9932CC | |
YellowGreen | # 9ACD32 | |
Sienna | # A0522D | |
Brown | # A52A2A | |
Tamno siva | # A9A9A9 | |
Svijetlo plavo | # ADD8E6 | |
GreenYellow | # ADFF2F | |
Paleturquoise | #AFEEEE | |
LightSteelBlue | # B0C4DE | |
PowderBlue | # B0E0E6 | |
FireBrick | # B22222 | |
DarkGoldenRod | # B8860B | |
MediumOrchid | # BA55D3 | |
RosyBrown | # BC8F8F | |
Darkkhaki | # BDB76B | |
Srebro | # C0C0C0 | |
MediumVioletRed | # C71585 | |
IndianRed | # CD5C5C | |
Peru | # CD853F | |
Čokolada | # D2691E | |
Tan | # D2B48C | |
Svijetlo siva | # D3D3D3 | |
PaleVioletRed | # D87093 | |
Thistle | # D8BFD8 | |
Orhideja | # DA70D6 | |
GoldenRod | # DAA520 | |
Crimson | # DC143C | |
Gainsboro | #DCDCDC | |
Šljiva | # DDA0DD | |
BurlyWood | # DEB887 | |
LightCyan | # E0FFFF | |
Lavanda | # E6E6FA | |
Darklosos | # E9967A | |
Violet | # EE82EE | |
PaleGoldenRod | # EEE8AA | |
LightCoral | # F08080 | |
Kaki | # F0E68C | |
AliceBlue | # F0F8FF | |
HoneyDew | # F0FFF0 | |
Azure | # F0FFFF | |
Sandybrown | # F4A460 | |
Pšenica | # F5DEB3 | |
Bež | # F5F5DC | |
WhiteSmoke | # F5F5F5 | |
MintCream | # F5FFFA | |
Ghostwhite | # F8F8FF | |
Losos | # FA8072 | |
AntiqueWhite | # FAEBD7 | |
Posteljina | # FAF0E6 | |
LightGoldenRodYellow | # FAFAD2 | |
OldLace | # FDF5E6 | |
Crveni | # FF0000 | |
Fuksija | # FF00FF | |
Magenta | # FF00FF | |
Deeppink | # FF1493 | |
OrangeRed | # FF4500 | |
Paradajz | # FF6347 | |
HotPink | # FF69B4 | |
Coral | # FF7F50 | |
Darkorange | # FF8C00 | |
LightSalmon | # FFA07A | |
Narandžasta | # FFA500 | |
LightPink | # FFB6C1 | |
Pink | # FFC0CB | |
Zlato | # FFD700 | |
PeachPuff | # FFDAB9 | |
NavajoWhite | #FFDEAD | |
Mokasina | # FFE4B5 | |
Bisque | # FFE4C4 | |
MistyRose | # FFE4E1 | |
BlanchedAlmond | #FFEBCD | |
PapayaWhip | # FFEFD5 | |
LavenderBlush | # FFF0F5 | |
SeaShell | # FFF5EE | |
Cornssilk | # FFF8DC | |
LemonChiffon | #FFFACD | |
FloralWhite | # FFFAF0 | |
Snijeg | #FFFAFA | |
Žuta | # FFFF00 | |
LightYellow | # FFFFE0 | |
Ivory | # FFFFF0 | |
Bijelo | #FFFFFF |