HEX-kodo kunpremas tri 8-bitajn nombrojn en ses heksadecimajn ciferojn. Konverti HEX al RGB signifas dividi tiujn ciferojn en parojn kaj legi ĉiun paron kiel dekuman nombron inter 0 kaj 255 — ĝuste la valoroj, kiujn CSS, Figma kaj bildredaktiloj atendos.
Kiel funkcias konvertado de HEX al RGB
- Forigu la antaŭan # kaj, se la kodo havas nur tri ciferojn, duobligu ĉiun: #f53 fariĝas #ff5533.
- Dividu la ses ciferojn en tri parojn — RR, GG kaj BB.
- Legu ĉiun paron kiel baz-16 nombron kaj konvertu ĝin al bazo-10: FF fariĝas 255, 57 fariĝas 87, 33 fariĝas 51.
- Skribu la tri rezultojn kiel rgb(R, G, B).
Efektiva ekzemplo
Ĉi tiu konverto estas preciza. HEX kaj RGB priskribas la samajn sRGB-valorojn en malsama notacio, do nenio estas rondigita aŭ perdita en ambaŭ direktoj.
HEX kaj RGB klarigo
Kio estas HEX?
HEX-kodo estas ses-cifera heksadecima nombro kiu stokas la ruĝan, verdan kaj bluan kanalon de koloro post antaŭa #. Ĉiu paro da ciferoj kovras unu kanalon, de 00 (neniu) ĝis FF (plena), kio donas la samajn 16.7 milionojn da koloroj kiel RGB en multe pli mallonga notacio. HEX estas la defaŭlta en CSS, dizajnotiloj kaj markgvidlinioj.
- Sintekso:
- #RRGGBB
- Gamo:
- 00–FF po kanalo
- Plej taŭga por:
- CSS, transdono de dezajno, markgvidlinioj
Kio estas RGB?
RGB priskribas koloron kiel tri lumkanalojn — ruĝa, verda kaj blua — ĉiu de 0 ĝis 255. Ĝi spegulas kiel ekranoj fakte funkcias: ĉiuj tri je 255 donas blankon, ĉiuj je 0 donas nigrion. RGB estas la ĝusta elekto kiam vi bezonas kalkuli kun koloro, kaj rgba() aldona travideblecon supre.
- Sintekso:
- rgb(R, G, B)
- Gamo:
- 0–255 po kanalo
- Plej taŭga por:
- kodo, canvas, travidebleco kun rgba()
HEX al RGB referenctabelo
La plej oftaj CSS-koloroj, konvertitaj de HEX al RGB.
| Koloro | HEX | RGB |
|---|---|---|
| black | #000000 | rgb(0, 0, 0) |
| white | #FFFFFF | rgb(255, 255, 255) |
| red | #FF0000 | rgb(255, 0, 0) |
| lime | #00FF00 | rgb(0, 255, 0) |
| blue | #0000FF | rgb(0, 0, 255) |
| yellow | #FFFF00 | rgb(255, 255, 0) |
| orange | #FFA500 | rgb(255, 165, 0) |
| teal | #008080 | rgb(0, 128, 128) |
| purple | #800080 | rgb(128, 0, 128) |
| gray | #808080 | rgb(128, 128, 128) |