Kako podesiti pametne telefone i računare. Informativni portal
  • Dom
  • Sigurnost
  • gb boja. Boja u stilovima se može postaviti na različite načine: heksadecimalnom vrijednošću, imenom, u RGB, RGBA, HSL, HSLA formatu

gb boja. Boja u stilovima se može postaviti na različite načine: heksadecimalnom vrijednošću, imenom, u RGB, RGBA, HSL, HSLA formatu

Kodovi boja u CSS-u se koriste za specifikaciju boja. Obično se kodovi boja ili vrijednosti boja koriste za postavljanje boje za prednji plan elementa (npr. tekst, boja veze) ili pozadinu elementa (pozadina, boja bloka). Također se mogu koristiti za promjenu boje gumba, ivica, markera, lebdenja i drugih dekorativnih efekata.

Možete postaviti svoje vrijednosti boja u različitim formatima. Sljedeća tabela navodi sve moguće formate:

Ovi formati su detaljnije opisani u nastavku.

CSS Boje - Hex kodovi

Heksadecimalni kod boja je šestocifreni prikaz boja. Prve dvije cifre (RR) su crvena vrijednost, sljedeće dvije su zelena vrijednost (GG), a posljednje dvije su plava vrijednost (BB).

CSS boje - kratki heksadecimalni kodovi

Kratki heksadecimalni kod boje je kraći oblik notacije od šest znakova. U ovom formatu, svaka cifra se ponavlja kako bi se dobila ekvivalentna šestocifrena vrijednost boje. Na primjer: #0F0 postaje #00FF00.

Heksadecimalna vrijednost može se uzeti iz bilo kojeg grafičkog softvera kao što je Adobe Photoshop, Core Draw, itd.

Svakom heksadecimalnom kodu boje u CSS-u prethodiće heš znak "#". Slijede primjeri upotrebe heksadecimalne notacije.

CSS boje - RGB vrijednosti

RGB vrijednost je kod boje koji se postavlja pomoću svojstva rgb(). Ovo svojstvo ima tri vrijednosti: po jednu za crvenu, zelenu i plavu. Vrijednost može biti cijeli broj, od 0 do 255, ili postotak.

Bilješka: Ne podržavaju svi pretraživači svojstvo boje rgb(), pa se ne preporučuje da ga koristite.

Ispod je primjer koji prikazuje više boja koristeći RGB vrijednosti.

Generator kodova boja

Pomoću naše usluge možete kreirati milione kodova boja.

Sigurne boje pretraživača

Ispod je tabela od 216 boja koje su najsigurnije i nezavisne od računara. Ove boje u CSS-u se kreću od 000000 do FFFFFF hex koda. Oni su bezbedni za upotrebu jer obezbeđuju da će svi računari ispravno prikazati boju kada rade sa paletom od 256 boja.

Tabela "sigurnih" boja u CSS-u
#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
#FF0000#FF0033#FF0066#FF0099#FF00CC#FF00FF
#FF3300#FF3333#FF3366#FF3399#FF33CC#FF33FF
#FF6600#FF6633#FF6666#FF6699#FF66CC#FF66FF
#FF9900#FF9933#FF9966#FF9999#FF99CC#FF99FF
#FFCC00#FFCC33#FFCC66#FFCC99#FFCCCC#FFCCFF
#FFFF00#FFFF33#FFFF66#FFFF99#FFFFCC#FFFFFF

Heksadecimalni brojevi se koriste za određivanje boja. Heksadecimalni sistem je, za razliku od decimalnog, zasnovan, kao što mu ime govori, 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 heksadecimalnom sistemu formiraju se kombinovanjem dva broja u jedan. Na primjer, broj 255 u decimalnom obliku odgovara broju FF u heksadecimalnom. Da bi se izbjegla zabuna u definiciji brojevnog sistema, heksadecimalnom broju prethodi heš simbol #, na primjer #666999. Svaka od tri boje - crvena, zelena i plava - može imati vrijednosti od 00 do FF. Tako je oznaka boje podijeljena na tri komponente #rrggbb, gdje prva dva znaka označavaju crvenu komponentu boje, dva srednja zelenu, a posljednja dva plavu. Dozvoljeno je koristiti skraćeni oblik #rgb, gdje svaki znak treba udvostručiti. Dakle, unos #fe0 treba smatrati #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. U tabeli. 1 prikazuje nazive, heksadecimalni kod, vrijednosti u RGB, HSL formatu i opis.

Tab. 1. Nazivi boja
Ime Boja Šifra RGB HSL Opis
bijela #fffff ili #ffff 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%) Crna
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%) Tamno 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 definirati boju koristeći crvene, zelene i plave vrijednosti u decimalnim terminima. Svaka od tri komponente boje ima vrijednost od 0 do 255. Također je prihvatljivo postaviti boju kao postotak, dok će 100% odgovarati broju 255. Prvo se specificira ključna riječ rgb, a zatim se komponente boje navedeno u zagradama, odvojeno 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 postavlja transparentnost elementa. Vrijednost 0 je potpuno transparentna, 1 je neprozirna, a srednja vrijednost poput 0,5 je prozirna.

RGBA je dodat u CSS3, tako da valjanost CSS koda treba da se izvrši prema ovoj verziji. Treba napomenuti da je CSS3 standard još uvijek u razvoju i da se neke njegove karakteristike mogu promijeniti. Na primjer, RGB boja dodana svojstvu background-color prolazi provjeru valjanosti, ali ona dodana svojstvu background-a 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 vrijednost boje na kotaču boja (slika 1) i određena je u stepenima. 0° je crvena, 120° je zelena, a 240° je plava. Vrijednost nijanse može varirati 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 da nema boje i ima nijansu sive, 100% je maksimalna vrijednost zasićenja.

Svjetlost postavlja koliko je svijetla boja i specificira se kao postotak od 0% do 100%. Male vrednosti čine boju tamnijom, dok je visoke vrednosti čine svetlijom, ekstremne vrednosti od 0% i 100% odgovaraju crno-beloj.

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 je potpuno transparentna, 1 je neprozirna, a srednja vrijednost poput 0,5 je prozirna.

Vrijednosti boja u formatima RGBA, HSL i HSLA se dodaju u CSS3, pa kada koristite ove formate, provjerite valjanost koda u odnosu na verziju.

HTML5 CSS2.1 CSS3 IE Cr Op Sa Fx

Boje

Upozorenje

Sve metode hvatanja lava navedene na stranici su teorijske i bazirane na računskim metodama. Autori ne jamče vašu sigurnost prilikom njihove upotrebe i odriču se bilo kakve odgovornosti za rezultat. Zapamtite, lav je grabežljivac i opasna životinja!

Arrrgh!

Rezultat ovog primjera prikazan je na sl. 2.

Rice. 2. Boje na web stranici

U HTML-u, boja se može specificirati na tri načina:

Postavljanje boje u HTML-u prema njenom imenu

Neke boje se mogu specificirati njihovim imenom, koristeći naziv boje na engleskom kao vrijednost. Najčešće ključne riječi: crna (crna), bijela (bijela), crvena (crvena), zelena (zelena), plava (plava) itd.:

Boja teksta - crvena

Najpopularnije boje standarda World Wide Web Consortium (W3C) su:

BojaImeBojaIme BojaIme BojaIme
Crna siva Srebro Bijelo
Žuta kreč Aqua Fuksija
Crveni Zeleno Plava Ljubičasta
maroon Maslina mornarica Teal

Primjer korištenja različitih naziva boja:

Primjer: postavljanje boje prema njenom imenu

Zaglavlje na crvenoj pozadini

Zaglavlje na narandžastoj pozadini

Zaglavlje na krečnoj pozadini

Bijeli tekst na plavoj pozadini

Zaglavlje na crvenoj pozadini

Zaglavlje na narandžastoj pozadini

Zaglavlje na krečnoj pozadini

Bijeli tekst na plavoj pozadini

Određivanje boje pomoću RGB

Kada se na monitoru prikazuju različite boje, kao osnova se uzima RGB paleta. Bilo koja boja se dobija mešanjem tri glavne: R - crveno, G - zelena (zelena), B - plava (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 drugi su postavljeni na 0 Možete također postaviti boju u postocima. Svaki od parametara označava nivo svjetline odgovarajuće boje. Na primjer: vrijednosti rgb(127, 255, 127) i rgb(50%, 100%, 50%) će postaviti istu zelenu boju srednje zasićenosti:

Primjer: Određivanje boje pomoću RGB-a

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 korištenjem heksadecimalnih (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 unija dva znaka u jednu vrijednost. Na primjer, najveći broj 255 u decimalnom obliku odgovara najvećem FF u heksadecimalnom. Za razliku od decimalnog sistema, heksadecimalnom broju prethodi znak funte. # , na primjer, #FF0000 se prikazuje kao crvena jer je crvena postavljena na najvišu vrijednost (FF), a druge boje su postavljene na minimalnu vrijednost (00). Znakovi nakon heš simbola # može se pisati i velikim i malim slovima. Heksadecimalni sistem vam omogućava da koristite skraćeni oblik #rgb, gde je svaki znak jednak dva puta. Dakle, unos #f7O treba smatrati #ff7700.

Primjer: Boja HEX

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
Crna Crna #000000 0 0 0
Plava Plava #0000FF 0 0 255
Bondi Blue Plaža Bondi #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 zeleno #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
kreč 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
morsko zeleno 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
ljubičasta Violet #8B00FF 139 0 255
Žuta Žuta #FFFF00 255 255 0

Kodovi boja (pozadina) prema zasićenosti i nijansama.

Top Related Articles