En HEX-kode pakker tre 8-bit tal i seks hexadecimale cifre. At konvertere HEX til RGB betyder at splitte cifrene i par og læse hvert par som et decimalt tal mellem 0 og 255 — præcis de værdier CSS, Figma og billededitorer forventer.
Sådan fungerer konvertering fra HEX til RGB
- Fjern det indledende #, og hvis koden kun har tre cifre, fordobl hvert: #f53 bliver #ff5533.
- Split de seks cifre i tre par — RR, GG og BB.
- Læs hvert par som et base-16-tal og konverter til base 10: FF bliver 255, 57 bliver 87, 33 bliver 51.
- Skriv de tre resultater som rgb(R, G, B).
Eksempel
Denne konvertering er eksakt. HEX og RGB beskriver de samme sRGB-værdier i forskellig notation, så intet rundes eller går tabt i nogen retning.
HEX og RGB forklaret
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
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()
HEX til RGB referenceoversigt
De mest almindelige CSS-farver, konverteret fra HEX til RGB.
| Farve | 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) |