Birač boja

Kako se koristi birač boja

1. Klikni uzorak ispod Izaberi boju da otvoriš birač boja svog pregledača, pa izaberi boju. Možeš i da upišeš ili nalepiš vrednost u polje Kod boje: HEX kod poput #1E90FF, rgb(30, 144, 255), hsl(210 100% 56%) ili CSS naziv poput tomato.
2. Veliki pregled se odmah ažurira, a HEX kod je ispisan crnom ili belom bojom, zavisno od toga šta se bolje čita na toj pozadini.
3. U odeljku Kodovi boje kopiraj format koji ti treba dugmetom Kopiraj pored njega: HEX, RGB, HSL, HSV ili CMYK.
4. Klikni Nasumična boja kad ti treba inspiracija ili Uzmi sa ekrana (u pregledačima koji to podržavaju, kao što su Chrome i Edge) da uzmeš bilo koji piksel sa ekrana, uključujući druge prozore.

Sve se dešava u tvom pregledaču: nijedna boja ni slika se nigde ne šalje.

Šta znači koji kod boje

• HEX je šestocifreni heksadecimalni zapis koji se koristi u HTML-u i CSS-u. Svaki par cifara je jedan kanal (crveni, zeleni, plavi) od 00 do FF, pa #1E90FF znači crveno 30, zeleno 144, plavo 255.
• RGB daje ista tri kanala kao decimalne brojeve od 0 do 255. To očekuje većina dizajnerskih programa i programerskih biblioteka.
• HSL opisuje boju tonom (uglom od 0° do 360° na krugu boja), zasićenošću i svetlinom. Zgodan je za posvetljivanje ili potamnjivanje boje promenom samo jednog broja.
• HSV (naziva se i HSB) koristi ton, zasićenost i vrednost (osvetljenost). To je model iza kvadrata boja u Photoshopu, Figmi i mnogim drugim uređivačima.
• CMYK izražava boju kao procente mastila cijan, magenta, žuta i crna.

O CMYK vrednostima

CMYK kodovi su naivno pretvaranje: K = 1 − max(R, G, B), zatim C = (1 − R − K) / (1 − K), a isto važi za M i Y. To je standardna udžbenička formula, ali ne koristi ICC profil. Prava štampa zavisi od mašine, papira i mastila, pa će štamparija pretvoriti tvoje boje sopstvenim profilom i rezultat se može razlikovati. Ove brojeve koristi kao polaznu tačku, a ne kao dokaz za štampu.

Čitanje odnosa kontrasta

Ispod HEX koda pregled prikazuje Kontrast na belom i Kontrast na crnom, izračunate formulom relativne luminanse iz WCAG 2. Odnos 4,5:1 ili veći potreban je za običan tekst na nivou AA, a 3:1 za veliki tekst i elemente interfejsa. Ako tvoja boja na belom dostiže samo 3:1, sačuvaj je za velike naslove ili ikone, a za tekst upotrebi tamniju nijansu.

Saveti

• HEX kodove možeš da nalepiš bez znaka #: radi i 1e90ff, kao i kratki oblici poput f60.
• Vrednosti sa providnošću, kao rgb(0 0 0 / 50%), se prihvataju. Birač prikazuje neprovidnu boju.
• Dijalog boja samog pregledača razlikuje se od sistema do sistema. Ako ti treba tačna vrednost, upisivanje u polje Kod boje uvek je precizno.