Plava rgb boja. Boja u stilovima se može specificirati na različite načine: heksadecimalnom vrijednošću, imenom, u RGB, RGBA, HSL, HSLA formatu
Kao što znate, boja može uticati na stanje osobe: i mentalno i fizičko. Svaki dan, dok pretražujete web stranice na internetu, oči procjenjuju milione boja i nijansi. Web dizajner koji poznaje psihologiju boja može manipulirati raspoloženjem posjetitelja kako bi postigao određene ciljeve.
To je zbog činjenice da neke nijanse smiruju, a neke, naprotiv, uzbuđuju. Zatim ćemo govoriti o tome kako se boja sintetizira i prikazuje pomoću kompjuterske tehnologije.
RGB je model boja koji predstavlja metodu dobijanja svih boja i njihovih nijansi miješanjem u različitim omjerima tri glavne komponente, a to su:
- Crvena boja ( Crveni);
- zelena boja ( Zeleno);
- plava boja ( Plava).
Odatle dolazi skraćeni naziv RGB. Ove boje su izabrane kao glavne s razlogom: razlog je fiziologija retine ljudskog oka i kako ih ono percipira:
RGB model je i danas najpopularniji i koristi se za reprodukciju boja na TV ekranima i kompjuterski monitori. Budući da proizvođači svojim proizvodima daju različite karakteristike, 1996. godine je nastao jedan sistem Sinteza boja zasnovana na RGB pod nazivom sRGB, koju su zajednički razvili Microsoft i HP.
Numerički prikaz boje
Kao što je ranije spomenuto, RGB boje se formiraju miješanjem primarnih boja. Da bi se opisao intenzitet svakog od njih, usvojena je šema u kojoj je boja predstavljena rasponom 0-255 (8 bita), što u heksadecimalnom zapisu odgovara 00-FF.
Odnosno, primarne boje će izgledati ovako:
- Crvena – RGB (255,0,0);
- Zelena – RGB (0,255,0);
- Plava – RGB (0,0,255);
Ako intenzitet boje ima vrijednosti manje od 255, tada se dobijaju različite nijanse crvene, zelene i plave. Slijedi tabela njihovih gradacija, kao i heksadecimalne vrijednosti svake od nijansi:
RGB tabele boja
Naravno, pored gradacija primarnih boja, postoje i mješovite, a njihov broj je prilično velik. Stoga je kreirana tabela RGB boja u kojoj su prikazane sve postojeće nijanse, kao i njihova imena i numerički prikazi ( u decimalnom i heksadecimalnom obliku).
Možete ga pogledati ovdje. Ova tabela znatno olakšava život web dizajnerima, jer za nekoliko sekundi možete pronaći željenu nijansu i saznati njen brojčani prikaz.
Sigurna RGB paleta boja
Međutim, u jednom trenutku se pojavio problem sa prikazivanjem boja u različitim pretraživačima, pa je za njegovo rješavanje sastavljena takozvana “sigurna” paleta RGB boja, koje su izvedene matematičkim proračunima.
Kada pretraživač ne može ispravno prikazati boju, pokušat će dobiti nešto što mu je potrebno miješanjem susjednih boja i najvjerovatnije će rezultat biti potpuno neprihvatljiv:
Koristeći RGB kodove boja iz ove palete, web programer ne može brinuti o prikazu boja na stranicama svoje stranice kada se gleda pomoću različitim pretraživačima, na raznim platformama i monitorima. Iako u ovom trenutku tabela sigurnih boja gubi na važnosti ( tehnološki napredak i dalje ne miruje), kada ga koristite možete, kako kažu, mirno spavati.
Zlatna boja u RGB modelu
Reč „zlato“ je prvi put upotrebljena početkom 14. veka da opiše boju hemijskog elementa zvanog Aurum – zlato. U RGB modelu, zlatna boja je predstavljena sljedećim brojčanim vrijednostima:
- RGB (255, 215, 0) – decimalni sistem;
- HEX #FFD700 – heksadecimalni sistem.
Bež boja u RGB modelu
Bež boja zauzima prilično značajno mjesto u istoriji, čak i ako nije najizrazitija. Mnogi spomenici kulture, posebno antičke skulpture, napravljeni su od kamena sapunice i sapunice, koji imaju bež nijansu. U RGB modelu, bež boja ima sljedeće numeričke prikaze.
Ova stranica sadrži tabelu s ključnim riječima koje se mogu koristiti za označavanje boja u jezicima web programera kao što su: HTML, CSS, JavaScript, Flash, itd.
U starim specifikacijama za koncern WC3 bilo je specificirano samo 16 ključnih riječi uz pomoć kojih su boje bile postavljene u HTML i CSS. U daljnjim, modernijim specifikacijama, dodato je još 130 ključnih riječi koje označavaju nazive boja. Sljedeća tabela sadrži nazive boja i heksadecimalne i RGB kodove kojima odgovaraju.
Prema CSS pravilima, imena boja ne razlikuju velika i mala slova. Unosi boja IndianRed i indianred 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 se neke ključne riječi odnose na istu boju. Dakle, imena Grey i Grey predstavljaju 50% sive kod boje #808080, a riječ Magenta je sinonim za HTML boju Fuchsia, koja odgovara heksadecimalnom kodu #FF00FF. Također su sinonimi riječi Aqua i Cyan, odgovaraju kodu #00FFFF.
|
|
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
HTML boje
HTML boje i načini njihovog specificiranja
U HTML-u postoje dva načina da odredite boju:
1. Koristeći naziv boje,
2. Korištenje RGB sistema, gdje su boje specificirane u heksadecimalnom formatu.
Naziv boje
Ime boje u HTML-u označeno engleskim riječima, kao što su crvena ili zelena. Ime boje djeluje kao vrijednost atributa HTML oznake. Postoji mnogo imena cvijeća, u ovom članku ćemo razmotriti samo glavne.
Obično se u HTML-u koriste dva atributa za postavljanje boje:
1. Atribut color="color_name" - boja teksta,
2. Atribut bgcolor="color_name" - boja pozadine.
Primjeri korištenja atributa boje:
color="red" - dodijelite crvenu boju tekstu,
bgcolor="green" - dodijeliti zelenu boju pozadini.
Tabela osnovnih HTML imena boja:
| Naziv boje | Njegov izgled | Prevod |
|---|---|---|
| bela | Bijelo | |
| slonovače | Ivory | |
| srebro | Srebro | |
| siva | Siva | |
| crna | Crno | |
| maroon | Maroon | |
| crvena | Crveni | |
| narandžasta | Narandžasta | |
| zlato | Zlato | |
| žuta | Žuta | |
| maslina | Maslina | |
| kreč | Lime | |
| zeleno | Zeleno | |
| aqua | Morski talas | |
| plava | Plava | |
| mornarica | Navi | |
| teal | Tirkizna | |
| fuksija | Magenta | |
| ljubičasta | Ljubičasta |
Heksadecimalni sistem brojeva
U svakodnevnom životu koristimo decimalni brojevni sistem od 0 do 9. Programeri i dizajneri često koriste heksadecimalni sistem brojeva od 0 do 15, gdje:
10 = A
11 = B
12 = C
13 = D
14 = E
15 = F
Gotovo svaka boja i nijansa vidljiva našem vidu može se napisati u heksadecimalnom sistemu, na primjer, crvena boja crvena u heksadecimalnom sistemu će biti jednaka ff0000
color="red" - crvena boja, po imenu,
color="#ff0000" — crvena boja, u heksadecimalnom brojevnom sistemu.
U HTML-u, heksadecimalnom broju prethodi heš znak # u vrijednosti atributa.
RGB
Prije nego počnete specificirati boje u HTML-u koristeći heksadecimalni brojevni sistem, prvo morate naučiti nešto o takvoj stvari kao što je R G B
RGB je skraćenica za riječi R ed G reen Blue (Red Green Blue).
Boja u HTML-u, napisana heksadecimalno, sastoji se od tri bloka brojeva 00 00 00, pri čemu je svaki blok odgovoran za jednu od RGB boja, prvi blok za crvenu, drugi za zelenu i treći za plavu. Brojevi se mogu kretati od 00 do ff.
Gdje je ff 255 u decimalnom zapisu.
RGB šema:
Crvena - od 00 do ff
Zelena - od 00 do ff
Plava - od 00 do ff
Kao rezultat, dobijamo šestocifreni broj 000000, pri čemu su prva dva broja odgovorna za crvenu boju, druga dva broja za zelenu, a treća dva broja za plavu boju.
Ako želimo da dobijemo crvenu boju, onda pišemo ff0000, zelenu boju 00ff00, plavu boju 0000ff. Na primjer, ako želimo dobiti tamnocrvenu boju, onda moramo smanjiti prvi blok brojeva i umjesto ff (što je jednako 255 u decimalnom brojevnom sistemu), napišite na primjer 96 (što je jednako 150 u decimalnom brojevnom sistemu).
Radi jasnoće, dajemo primjere boja i njihov heksadecimalni kod:
Miješanje boja u HTML-u
Ako niste propustili časove crtanja u školi, vjerovatno se sjećate da ravnomjernim miješanjem crvene i zelene možete dobiti žutu,
kada dodate malo zelene u crvenu možete dobiti narandžastu itd.
Heksadecimalne i RGB boje se također mogu miješati:
Eksperimentiranjem sa heksadecimalnim brojevnim sistemom i RGB-om, na kraju ćete se snaći u tome i moći ćete odabrati boju koju želite.
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 razni sistemi prikaz boja. Svojstvo opisuje boju tekstualnog sadržaja elementa. Osim toga, koristi se 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 | |
| bela | #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 modela
Heksadecimalni format RGB vrijednosti je znak # nakon kojeg odmah slijede tri ili šest heksadecimalnih znakova. Trocifrena RGB notacija #rgb se pretvara u šestocifreni oblik #rrggbb kopiranjem cifara umjesto dodavanjem nula. Na primjer, #fb0 se proširuje na #ffbb00 . Ovo osigurava da bijela #ffffff može biti navedena u kratkom #fff unosu i uklanja sve ovisnosti o dubini boje prikaza.
Format RGB vrijednosti u funkcionalnoj notaciji je rgb(, nakon čega slijedi lista od tri odvojena zarezima numeričke vrijednosti(ili tri cjelobrojne vrijednosti ili tri procentualne vrijednosti) nakon kojih 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.
U HTML-u, boja se može specificirati na tri načina:
Postavljanje boje u HTML-u prema njenom imenu
Neke boje se mogu odrediti njihovim imenom, koristeći naziv boje na engleski jezik. Najčešće ključne riječi: crna, bijela, crvena, zelena, plava, itd.:
Boja teksta – crvena
Najpopularnije boje standarda World Wide Web Consortium (W3C):
| Boja | Ime | Boja | Ime | Boja | Ime | Boja | Ime |
|---|---|---|---|---|---|---|---|
| Crno | siva | Srebro | Bijelo | ||||
| Žuta | Lime | Aqua | Fuksija | ||||
| Crveni | Zeleno | Plava | Ljubičasta | ||||
| Maroon | Maslina | mornarica | Teal |
Primjer korištenja različitih naziva boja:
Primjer: navođenje boje po imenu
- Probajte sami"
Zaglavlje na crvenoj pozadini
Zaglavlje na narandžastoj pozadini
Idemo na krečnu podlogu
Bijeli tekst na plavoj pozadini
Zaglavlje na crvenoj pozadini
Zaglavlje na narandžastoj pozadini
Idemo na krečnu podlogu
Bijeli tekst na plavoj pozadini
Određivanje boje pomoću RGB
Kada se na monitoru prikazuju različite boje, RGB paleta se koristi kao osnova. Bilo koja boja se dobija mešanjem tri osnovne boje: R - crveno, G - zelena, B - plava. Svjetlina svake boje je data jednim bajtom i stoga može imati vrijednosti od 0 do 255. Na primjer, RGB(255,0,0) se prikazuje kao crvena jer je crvena postavljena na najveću vrijednost (255) i ostatak je postavljen na 0. Boju možete postaviti i kao postotak. Svaki parametar označava nivo svjetline odgovarajuće boje. Na primjer: vrijednosti rgb(127, 255, 127) i rgb(50%, 100%, 50%) će postaviti istu srednje zelenu boju:
Primjer: Određivanje boje pomoću RGB-a
- Probajte sami"
rgb(127, 255, 127)
rgb(50%, 100%, 50%)
rgb(127, 255, 127)
rgb(50%, 100%, 50%)
Postavite boju po heksadecimalnoj vrijednosti
Vrijednosti R G B također se može specificirati koristeći heksadecimalne (HEX) vrijednosti boja u obliku: #RRGGBB gdje su RR (crvena), GG (zelena) i BB (plava) heksadecimalne vrijednosti od 00 do FF (isto kao decimalna 0-255 ) . Heksadecimalni sistem, za razliku od decimalnog sistema, zasnovan je, kao što mu ime govori, na broju 16. Heksadecimalni sistem koristi sledeće znakove: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F. Ovdje su brojevi od 10 do 15 zamijenjeni latiničnim slovima. Brojevi veći od 15 u heksadecimalnom sistemu su predstavljeni kombinovanjem dva znaka u jednu vrednost. Na primjer, najveći broj 255 u decimalnom obliku odgovara najvišoj vrijednosti FF u heksadecimalnom. Za razliku od decimalnog sistema, heksadecimalnom broju prethodi heš simbol. # , na primjer, #FF0000 je prikazano kao crveno jer je crvena postavljena na najvišu vrijednost (FF), a ostale boje su postavljene na minimalnu vrijednost (00). Znakovi iza heš simbola # Možete pisati i velikim i malim slovima. Heksadecimalni sistem vam omogućava da koristite skraćeni oblik #rgb, gdje je svaki znak ekvivalentan dvostrukom. Dakle, unos #f7O treba smatrati #ff7700.
Primjer: HEX boja
- Probajte sami"
crvena: #FF0000
zeleno: #00FF00
plava: #0000FF
crvena: #FF0000
zeleno: #00FF00
plava: #0000FF
crvena+zelena=žuta: #FFFF00
crvena+plava=ljubičasta: #FF00FF
zeleno+plavo=cijan: #00FFFF
Lista najčešće korištenih boja (naziv, HEX i RGB):
| engleski naziv | Rusko ime | Uzorak | HEX | RGB | ||
|---|---|---|---|---|---|---|
| Amarant | Amarant | #E52B50 | 229 | 43 | 80 | |
| Amber | Amber | #FFBF00 | 255 | 191 | 0 | |
| Aqua | Plavo zeleno | #00FFFF | 0 | 255 | 255 | |
| Azure | Azure | #007FFF | 0 | 127 | 255 | |
| Crno | Crno | #000000 | 0 | 0 | 0 | |
| Plava | Plava | #0000FF | 0 | 0 | 255 | |
| Bondi Blue | Bondi beach water | #0095B6 | 0 | 149 | 182 | |
| Brass | Brass | #B5A642 | 181 | 166 | 66 | |
| Brown | Brown | #964B00 | 150 | 75 | 0 | |
| Cerulean | Azure | #007BA7 | 0 | 123 | 167 | |
| Tamno proljetno zelena | Tamno proljetno zelena | #177245 | 23 | 114 | 69 | |
| Emerald | Emerald | #50C878 | 80 | 200 | 120 | |
| Patlidžan | Patlidžan | #990066 | 153 | 0 | 102 | |
| Fuksija | Fuksija | #FF00FF | 255 | 0 | 255 | |
| Zlato | Zlato | #FFD700 | 250 | 215 | 0 | |
| siva | Siva | #808080 | 128 | 128 | 128 | |
| Zeleno | Zeleno | #00FF00 | 0 | 255 | 0 | |
| Indigo | Indigo | #4B0082 | 75 | 0 | 130 | |
| Jade | Jade | #00A86B | 0 | 168 | 107 | |
| Lime | Lime | #CCFF00 | 204 | 255 | 0 | |
| Malahit | Malahit | #0BDA51 | 11 | 218 | 81 | |
| mornarica | Tamno plava | #000080 | 0 | 0 | 128 | |
| Oker | Oker | #CC7722 | 204 | 119 | 34 | |
| Maslina | Maslina | #808000 | 128 | 128 | 0 | |
| Narandžasta | Narandžasta | #FFA500 | 255 | 165 | 0 | |
| Breskva | Breskva | #FFE5B4 | 255 | 229 | 180 | |
| Tikva | Tikva | #FF7518 | 255 | 117 | 24 | |
| Ljubičasta | Violet | #800080 | 128 | 0 | 128 | |
| Crveni | Crveni | #FF0000 | 255 | 0 | 0 | |
| Šafran | Šafran | #F4C430 | 244 | 196 | 48 | |
| Sea Green | Zeleno more | #2E8B57 | 46 | 139 | 87 | |
| Močvarno zeleno | Bolotny | #ACB78E | 172 | 183 | 142 | |
| Teal | Plavo zeleno | #008080 | 0 | 128 | 128 | |
| Ultramarin | Ultramarin | #120A8F | 18 | 10 | 143 | |
| Violet | Violet | #8B00FF | 139 | 0 | 255 | |
| Žuta | Žuta | #FFFF00 | 255 | 255 | 0 | |
Kodovi boja (pozadina) prema zasićenosti i nijansama.
