RGB giver dig tre decimalkanaler mellem 0 og 255. At konvertere til HEX gør hver kanal til et tocifret hexadecimalt tal, så hele farven passer i et kompakt token, som enhver browser, designværktøj og styleguide forstår.
Sådan fungerer konvertering fra RGB til HEX
- Tag den røde kanal og divider den med 16: kvotienten er det første ciffer, resten er det andet.
- Skriv cifrene 10 til 15 som bogstaverne A til F — 255 bliver FF.
- Gentag for grøn og blå, og udfyld enkelte cifre med et foranstillet nul: 5 bliver 05.
- Sæt de tre par sammen og sæt et # foran.
Eksempel
Nøjagtigt, så længe kanalerne er hele tal fra 0 til 255. Brøkværdier som rgb(79.5, 70, 229) rundes først til nærmeste heltal, fordi HEX ikke kan gemme mellemværdier.
RGB og HEX forklaret
Hvad er RGB?
RGB beskriver en farve som tre lyskilder — rød, grøn og blå — hver fra 0 til 255. Det afspejler, hvordan skærme faktisk virker: alle tre på 255 giver hvid, alle på 0 giver sort. RGB er det rigtige valg, når du skal regne med en farve, og rgba() tilføjer gennemsigtighed ovenpå.
- Syntaks:
- rgb(R, G, B)
- Område:
- 0–255 per kanal
- Bedst til:
- kode, canvas, gennemsigtighed med rgba()
Hvad er HEX?
En HEX-kode er et sekscifret hexadecimalt tal, som gemmer en farves røde, grønne og blå kanal bag et indledende #. Hvert par cifre dækker én kanal fra 00 (ingen) til FF (fuld), hvilket giver de samme 16,7 millioner farver som RGB i en kortere notation. HEX er standard i CSS, designværktøjer og brandguidelines.
- Syntaks:
- #RRGGBB
- Område:
- 00–FF per kanal
- Bedst til:
- CSS, designoverlevering, brandguidelines
RGB til HEX referenceoversigt
De mest almindelige CSS-farver, konverteret fra RGB til HEX.
| Farve | 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 |