RGB ti daje tri decimalna kanala između 0 i 255. Pretvaranje u HEX znači svaki kanal pretvoriti u dvoznamenkasti heksadecimalni broj, tako da cijela boja stane u jedan kompaktan token koji svi preglednici, alati za dizajn i stilski vodiči razumiju.
Kako radi konverzija iz RGB u HEX
- Uzmi crveni kanal i podijeli ga sa 16: količnik je prva cifra, ostatak je druga.
- Zapiši cifre 10 do 15 kao slova A do F — 255 postaje FF.
- Ponavljaj za zeleni i plavi kanal, popunjavajući jednocifrene vrijednosti vodećom nulom: 5 postaje 05.
- Spoji tri para i stavi # ispred.
Primjer koji radi
Tačno, pod uslovom da su kanali cijeli brojevi od 0 do 255. Frakcijske vrijednosti poput rgb(79.5, 70, 229) prvo se zaokružuju na najbliži cijeli broj, jer HEX ne može pohraniti vrijednosti između.
RGB i HEX objašnjeni
Šta je RGB?
RGB opisuje boju kao tri kanala svjetlosti — crvenu, zelenu i plavu — svaki od 0 do 255. To odražava kako ekrani zapravo rade: svi na 255 daju bijelu, svi na 0 daju crnu. RGB je pravi izbor kad trebaš računati s bojom, a rgba() dodaje prozirnost preko toga.
- Sintaksa:
- rgb(R, G, B)
- Opseg:
- 0–255 po kanalu
- Najbolje za:
- kod, canvas, prozirnost s rgba()
Šta je HEX?
HEX kod je šesteroznamenkasti heksadecimalni broj koji pohranjuje crvenu, zelenu i plavu komponentu boje iza vodećeg #. Svaki par znamenki pokriva jednu komponentu, od 00 (nema) do FF (puno), što daje istih 16,7 miliona boja kao RGB, ali u kraćem zapisu. HEX je zadani u CSS-u, alatima za dizajn i smjernicama brenda.
- Sintaksa:
- #RRGGBB
- Opseg:
- 00–FF po kanalu
- Najbolje za:
- CSS, predaja dizajna, smjernice brenda
RGB u HEX referentna tabela
Najčešće CSS boje, konvertovane iz RGB u HEX.
| Boja | RGB | HEX |
|---|---|---|
| black | rgb(0, 0, 0) | #000000 |
| white | rgb(255, 255, 255) | #FFFFFF |
| red | rgb(255, 0, 0) | #FF0000 |
| lime | rgb(0, 255, 0) | #00FF00 |
| blue | rgb(0, 0, 255) | #0000FF |
| yellow | rgb(255, 255, 0) | #FFFF00 |
| orange | rgb(255, 165, 0) | #FFA500 |
| teal | rgb(0, 128, 128) | #008080 |
| purple | rgb(128, 0, 128) | #800080 |
| gray | rgb(128, 128, 128) | #808080 |