Oblikovanje spletnih strani in CSS
Barvo iz datoteke z dizajnom ali iz izbirnika posnetkov zaslona pretvorite v šestnajstiški kod, ki ga potrebuje vaš stilski list.
Pretvornik RGB v HEX — Pretvarjajte vrednosti RGB v šestnajstiške kode in šestnajstiške kode v RGB, s predogledom v realnem času.
Vnesite rdeče, zelene in modre številke, izberite barvo ali vstavite šestnajstiški kod in si oglejte vse oblike hkrati: HEX, RGB in HSL. Predogled v realnem času in preverjanje kontrasta vam pokažeta, katera barva besedila je najboljša. Vse deluje v vašem brskalniku.
Pretvorba barve
Barve ostanejo v vašem brskalniku
Izberite ali vnesite barvo
Aa
Barvne oznake
HEX
–RGB (CSS)
–HSL (CSS)
––Najboljša barva besedila na njem
–Kontrastno razmerje
Vodnik
Vodnik za pretvorbo iz RGB v HEX: barvne kode, HSL in kontrast
Spoznajte, kako delujejo barvne kode in kako izbrati berljive barvne kombinacije.
Kaj počne pretvornik iz RGB v HEX?
Zasloni ustvarjajo vse barve z mešanjem rdeče, zelene in modre svetlobe. V sistemu RGB se ta mešanica zapiše kot tri številke od 0 do 255. V sistemu HEX se iste tri številke zapišejo v šestnajstiškem sistemu kot kratka koda, na primer #1F3A5F, ki jo običajno uporabljajo CSS, orodja za oblikovanje in priročniki za blagovne znamke.
Vnesite tri številke, izberite barvo s pomočjo izbirnika ali vnesite šestnajstiški kod. Vsi formati se posodobijo hkrati, poleg tega pa dobite tudi različico v formatu HSL ter priporočilo, katera barva besedila se na tej podlagi najbolje bere.
Zakaj ljudje pretvarjajo RGB v HEX
Blagovna znamka in dokumenti
Zagotovite, da so barve blagovne znamke enotne v datoteki z logotipom, predstavitvi in na spletni strani.
Dostopnost
Preden objavite, preverite, katera barva besedila se dobro ujema z ozadjem, in si oglejte kontrastno razmerje.
Kako se RGB pretvori v HEX
Vsako od treh številk se pretvori v dvomestno vrednost v šestnajstiškem sistemu, nato pa se trije pari združijo.
RGB: 31, 58, 95
31 = 1F (1 × 16 + 15)
58 = 3A (3 × 16 + 10)
95 = 5F (5 × 16 + 15)
HEX: #1F3A5F
Šestnajstiški sistem uporablja številke od 0 do 9 in črke od A do F, pri čemer A pomeni 10, F pa 15. Kratka koda, kot je #FA0, je skrajšana oblika: vsaka številka se podvoji, zato pomeni #FFAA00.
Pogoste barve v sistemih RGB in HEX
| Barva | RGB | HEX |
|---|---|---|
| Črna | 0, 0, 0 | #000000 |
| Bela | 255, 255, 255 | #FFFFFF |
| Rdeča | 255, 0, 0 | #FF0000 |
| Zelena | 0, 255, 0 | #00FF00 |
| Modra | 0, 0, 255 | #0000FF |
| Rumena | 255, 255, 0 | #FFFF00 |
| Oranžna | 255, 165, 0 | #FFA500 |
| Siva | 128, 128, 128 | #808080 |
Kako uporabljati pretvornik RGB v HEX
- Vnesite vrednosti za rdečo, zeleno in modro barvo ali kliknite vzorec, da uporabite izbirnik barv.
- Ali pa vnesite šestnajstiško kodo v polje »Hex«, če želite ravnati obratno.
- Preberite kode HEX, RGB in HSL ter preverite kontrastno razmerje in najboljšo barvo besedila.
- Kliknite na »Kopiraj« ob želenem formatu.
Preprosti nasveti za delo z barvami
- Da bo besedilo berljivo, poskrbite za kontrastno razmerje vsaj 4,5 : 1 za običajno besedilo in 3 : 1 za povečano besedilo.
- Pri šestnajstiških kodah se ne razlikuje med velikimi in malimi črkami, zato sta #1f3a5f in #1F3A5F enaka barva.
- V CSS-ju je znak # na začetku obvezen, tukaj pa je neobvezen. Kodo lahko vnesete z njim ali brez njega.
- Zasloni in tiskalniki prikazujejo barve različno, zato se natisnjena barva morda ne bo ujemala s tisto, ki jo vidite na zaslonu.
Omejitve in zasebnost
Zasebnost
Barve se pretvorijo v vašem brskalniku. Na naš strežnik se nič ne pošilja niti ne shranjuje. Na vaši napravi se shrani le izbira malih črk.
Omejitve
Orodje deluje s standardnimi 8-bitnimi barvami sRGB, od 0 do 255 na kanal. Ne podpira prosojnosti (RGBA ali 8-mestnih šestnajstiških vrednosti), barvnega prostora CMYK za tiskanje niti barvnih prostorov s širokim barvnim obsegom.
Pogosta vprašanja
Pogosta vprašanja o pretvorniku RGB v HEX
Kako pretvorim RGB v HEX?
Vnesite vrednosti za rdečo, zeleno in modro barvo, vsako v območju od 0 do 255. Orodje vsako število pretvori v dve števki v šestnajstiškem sistemu in ju združi, tako da se 31, 58, 95 pretvori v #1F3A5F.
Kako pretvorim HEX v RGB?
Heksadecimalno kodo vnesite v polje »Hex«. Tri številke RGB se izpolnijo hkrati. Na primer: #FF8800 je 255, 136, 0.
Ali mora imeti šestnajstiški kod znak #?
Ne. Vnesete ga lahko z znakom # ali brez njega, delujejo pa tudi kratke kode, kot je na primer #FA0. Rezultat vedno vključuje znak #, zato je pripravljen za uporabo v CSS.
Kaj pomenijo te tri RGB-vrednosti?
To so vrednosti rdeče, zelene in modre svetlobe, od 0 (nič) do 255 (polna). 0, 0, 0 je črna, 255, 255, 255 pa bela.
Za kaj se uporablja vrednost HSL?
HSL opisuje barvo kot odtenek, nasičenost in svetlost. Pogosto je lažje nastaviti te vrednosti ročno, na primer da barvo nekoliko posvetlimo, in to deluje neposredno v CSS.
Kaj mi pove kontrastno razmerje?
To kaže, kako dobro se črno ali belo besedilo izstopa na vaši barvi. Razmerje 4,5 : 1 ali več je običajna minimalna vrednost za običajno besedilo v skladu s smernicami za dostopnost WCAG.
Ali lahko vključim prosojnost?
Tukaj ne. To orodje podpira le neprosojne barve brez alfa kanala. Če želite doseči prosojnost, vrednost alfa dodajte sami v funkciji rgba() v svojem CSS-ju.
Ali se moji podatki shranijo ali pošljejo kamorkoli?
Ne. Pretvorba poteka v vašem brskalniku in nobena informacija ne zapusti vaše naprave. Za naslednjič se shrani le vaša izbira malih črk.
Od uporabnikov tega orodja
Mnenja
Nalaganje ocen…
Nadaljuj
Še več orodij v škatli
Na spletni strani je na voljo še več deset brezplačnih orodij, za katera ni potreben API-ključ.
Generator UUID-jev
Množično ustvarjanje naključnih UUID-jev v4, v7 in v5.
Odpri orodjeOdstranjevalnik presledkov
Odstranite odvečne presledke, tabulatorje in prazne vrstice.
Odpri orodjePretvornik enot
Pretvarjanje dolžine, teže, hitrosti in drugih vrednosti.
Odpri orodjePretvornik rimskih številk
Pretvori števila v rimske številke in nazaj.
Odpri orodje