Što je hex kod? Sve što trebate znati

Rad s bojama u HTML-u relativno je jednostavan. Uz nekoliko jednostavnih CSS deklaracija, možete promijeniti boju bilo kojeg teksta ili pozadine na svojoj web stranici. Ali kako odrediti boju? Odgovor na ovo pitanje odvest će nas u zečju rupu što nas na kraju dovodi do koncepta heksadecimalnih kodova boja.

Ako ste prije radili s HTML-om ili CSS-om, vjerojatno ste čuli za pojam heksadecimalni kod. Ali što je zapravo heksadecimalni kod? Koji su neki primjeri hex kodova? Koja je razlika između hex koda i RGB koda boja?

Što je hex kod?

Kada prvi put počnete raditi s bojom, možete koristiti grafičko sučelje za odabir boja koje ćete primijeniti na elemente na vašoj stranici. Kada počnete gledati temeljni kod, a ne samo svoj grafički uređivač, otkrit ćete da se boje pojavljuju kao nizovi znakova čudnog izgleda. Takve sekvence poznate su kao heksadecimalni kodovi; izgledaju otprilike ovako:

#FF0092

Povezano: Osnovni pojmovi grafičkog dizajna koje trebate znati

Možete odrediti boje u CSS-u na nekoliko različitih načina. Možete koristiti nazive nekih unaprijed definiranih boja kao npr

Crvena i tamnomagenta. Međutim, da biste odredili točne nijanse boja, morat ćete koristiti preciznije mjerenje: nešto numeričko.

CSS nudi dvije glavne opcije: RGB i hex. U oba formata određujete količine crvene, zelene i plave koje čine konačnu boju. RGB koristi tri broja između 0 i 255. Hex radi potpuno isto, samo s različitom bazom (16) od decimale (10) na koju ste navikli.

Hex koristi slova A-F, uz znamenke 0-9, za ukupno 16 simbola. A u heksadecima je ekvivalent 10 u decimalnom obliku. F u heksadecima je 15 u decimalnom obliku.

Kako funkcioniraju heksadecimalni kodovi boja?

U svom najosnovnijem obliku, heksadecimalni kod je prikaz koliko crvene, zelene i plave postoji u boji. Hex kod se sastoji od šest znakova. Prve dvije se odnose na količinu crvene boje u mješavini, sljedeće dvije odnose se na količinu zelene boje, a posljednje dvije znamenke odražavaju količinu plave. Hex kodovi odnose se na određene boje, omogućujući dizajnerima i programerima da lako komuniciraju o shemama boja.

Uz 16 × 16 (256) vrijednosti za svaku komponentu boje, tada postoji 256 × 256 × 256 mogućih kombinacija. U heksadecimalnom, oni se kreću od #000000 (čisto crno) do #FFFFFF (čisto bijelo).

Kako čitati heksadecimalne kodove boja

Lako je shvatiti heksadecimalne kodove boja. Uzmimo primjer #FF5733. Najprije podijelite šest znakova na tri dijela od kojih svaki sadrži po dva znaka. Kao što znate, prva dva dijela predstavljaju crvenu boju, druga dva dijela predstavljaju zelenu, a treća dva dijela predstavljaju plavu. Dakle, u našem primjeru:

• Crvena komponenta, RR, ima vrijednost FF.
• Zelena komponenta, GG, je 57.
• Plava komponenta, BB, je 33.

Sada, da biste pronašli intenzitet ovih segmenata boja, trebate izračunati heksadecimalni broj koristeći ova tri koraka:

1. Pomnožite prvi heksadecimalni znak RR sa 16. Ako je znak slovo, pretvorite ga u odgovarajuću vrijednost. U ovom slučaju, prvi znak je F što je 15. Dakle, za naš primjer, množite 15 × 16 što je jednako 240.
2. Zatim dodajte drugi znak RR. Opet, pretvorite slovo u odgovarajuću vrijednost, ako se ukaže potreba. U našem primjeru, drugi znak je F što je jednako 15.
3. Kada završite, dodajte zbrojeve kako biste dobili jednu vrijednost. Ako dodate 240 i 15 iz našeg primjera, vidjet ćete da je vrijednost FF 255.

Ponovite istu formulu za preostala dva segmenta, GG označen s 57 i BB označen s 33. Ako vam ručni izračuni izgledaju prezahvalni, uvijek možete koristiti heksadecimalni alat za pretvorbu u RGB (npr BinarniHex pretvarač) za čitanje boje. Trebali biste otkriti da je heksadecimalna vrijednost #FF5733 je ekvivalentno rgb (255, 87, 51).

Zašto je heksadecimalni kod boja tako popularan?

Iako postoji nekoliko različitih modela boja (RGB, CMYK, HSL), heksadecimalni kodovi boja su možda najčešće korišteni prikaz. To je zato što su jednostavne i lako razumljive.

Format fiksne širine također je vrlo koristan. Heksadecimalne boje pune duljine uvijek su sedam znakova, uključujući vodeći # simbol.

Hex boje su vrlo učinkovite, koristeći samo ovih sedam znakova za predstavljanje više od 16 milijuna boja. A razlikovanje ovih boja je jednostavan proces.

Hex vs. RGB: Postoji li razlika?

RGB sustav kodiranja bojama koristi tri decimalna broja za označavanje relativnih intenziteta crvene, zelene i plave boje. Koristi znamenke 0-9.

Hex također koristi tri broja za predstavljanje crvene, zelene i plave boje, ali koristi dodatne znamenke (A-F) kako bi zadovoljio bazu 16. Nema razlike u dobivenim bojama, to su jednostavno različiti formati za prenošenje istih informacija.

Povezano: Osnove CSS-a: rad s bojama

Za što se koristi hex kod?

RGB koristi niz različitih aplikacija, od televizijskih ekrana do mobilnih uređaja, igara i znakova. Uglavnom ćete vidjeti heksadecimalne kodove boja u web dizajnu i drugim grafičkim programima.

Hex kodove možete vidjeti i kao univerzalni način identificiranja boja. Mnoga web-mjesta koriste ih za identificiranje određene boje budući da su kratke i obično nedvosmislene u kontekstu.

Hex kod boja nije raketna znanost

Dakle, imate osnove heksadecimalnih kodova boja. Nisu baš teška znanost, ali služe određenoj svrsi u dizajnu (i u svijetu tehnologije). Ako tražite alat koji će vam pomoći razumjeti kako funkcioniraju heksadecimalne boje ili onaj koji će vas naučiti o teoriji RGB mješavine, postoji mnogo na internetu. Upamtite, ključ za učenje bilo čega novog je da to radite korak po korak.

Hex kodovi boja nisu najuzbudljivija stvar na svijetu, ali je od vitalnog značaja razumjeti ih ako radite u web dizajnu. Mogućnost rada s heksadecimalnim kodovima boja znatno će vam olakšati rad na dizajnu.

Kako pronaći heksadecimalnu vrijednost bilo koje boje na vašem zaslonu

Naučite kako odabrati bilo koju vrijednost boje sa zaslona u sekundi. Posebno korisno za web dizajnere!

Pročitajte dalje

O autoru