RGB gefur þér þrjár tugatölur á bilinu 0 til 255. Að umbreyta í HEX breytir hverri rás í tví-stafa hexadecimal tölu, svo allur liturinn passar í einn þéttan tákna sem hver vafri, hönnunarverkfæri og stíllguide skilur.
Hvernig RGB í HEX umbreyting virkar
- Taktu rauða rásina og deildu henni með 16: heiltöludeilingin er fyrsti stafurinn, afgangurinn er annar.
- Skrifaðu tölurnar 10 til 15 sem bókstafi A til F — 255 verður FF.
- Endurtaktu fyrir græna og bláa, bættu núlli fyrir framan einnar stafa tölur: 5 verður 05.
- Sameina þrjú pörin og settu # fyrir framan.
Dæmi sem virkaði
Nákvæmt svo framarlega sem rásirnar eru heiltölur frá 0 til 255. Brotastærðir eins og rgb(79.5, 70, 229) eru fyrst og fremst fyrirgert yfir í nærmasta heiltölu, því HEX getur ekki geymt millistig.
RGB og HEX útskýrt
Hvað er RGB?
RGB lýsir lit sem þrjár ljósrásir — rauð, græn og blá — hver frá 0 til 255. Þetta endurspeglar hvernig skjár virkar: allar þrjár í 255 gefa hvítt, allar í 0 gefa svart. RGB er rétta valið þegar þú þarft að reikna með lit — t.d. að hreyfa eina rás, blanda litum í kóða, eða bæta gegnsæi með rgba().
- Syntaks:
- rgb(R, G, B)
- Gildi:
- 0–255 per channel
- Best fyrir:
- kóði, canvas, gegnsæi með rgba()
Hvað er HEX?
HEX kóði er sex stafa hexadecimal tala sem geymir rauða, græna og bláa rás litar á undan með #. Sérhvert tvíund getur táknað eina rás, frá 00 (ekkert) til FF (fullt), sem gefur sama 16,7 milljón liti og RGB í mun styttri táknun. HEX er sjálfgefið í CSS, hönnunarverkfærum og leiðbeiningum vörumerkis.
- Syntaks:
- #RRGGBB
- Gildi:
- 00–FF per channel
- Best fyrir:
- CSS, afhending hönnunar, leiðbeiningar vörumerkis
RGB í HEX yfirlitstafla
Algengustu CSS-litirnir, umbreyttir frá RGB í HEX.
| Litur | 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 |