Färgkonverterare
Ange en hex-färgkod för att se dess motsvarigheter i RGB och HSL med individuella värden för röd, grön och blå kanal.
Så använder du denna färgkonverterare
- Ange hex-färgkoden
Skriv in en 6-siffrig hex-kod i fältet för hex-färgkod (t.ex. FF6B35 eller 00FF88). Utelämna #-symbolen.
- Läs av RGB-värdena
Resultaten för röd kanal, grön kanal och blå kanal visar värdena 0–255 för varje komponent.
- Kontrollera HSL-resultatet
Granska HSL-resultatet för nyans (0–360°), mättnad och ljusstyrka — användbart för färgjusteringar.
Så fungerar denna färgkonverterare
Detta verktyg konverterar en hexadecimal färgkod till RGB (röd, grön, blå) och HSL (nyans, mättnad, ljusstyrka). Varje hex-par motsvarar ett 8-bitars kanalvärde (0–255), och HSL-konverteringen använder standardiserad färgrymdsmatematik.
R = hex[0:2] → decimalt; G = hex[2:4] → decimalt; B = hex[4:6] → decimalt Hex #FF6B35 → RGB(255, 107, 53) → HSL(16, 100%, 60%).
Hex 000000 → RGB(0, 0, 0) → HSL(0, 0%, 0%) — helt svart.
Hex FFFFFF → RGB(255, 255, 255) → HSL(0, 0%, 100%) — helt vit. Hex 808080 → RGB(128, 128, 128) → HSL(0, 0%, 50%) — mellangrå.
- ✓ Inmatningen är en giltig 6-siffrig hex-färgkod.
- ✓ Alfakanal stöds inte i denna version.
- CMYK-konvertering kräver en färgprofil och ingår inte här.
Förstå färgmodeller
HEX, RGB och HSL är olika sätt att beskriva samma färg. HEX kodar RGB som en 6-siffrig hexadecimal sträng: varje teckenpar är en 8-bitars kanal (0–255). RGB uttrycker samma värden som tre tal, de additiva primärfärgerna som skärmar sänder ut. HSL (Hue, Saturation, Lightness) är en cylindrisk modell: nyans (hue) är vinkeln på färghjulet (0° röd, 120° grön, 240° blå), mättnad (saturation) är färgintensitet och ljusstyrka (lightness) är ljushet. Designer föredrar ofta HSL vid programmatisk färgjustering — att ändra enbart ljusstyrka gör färgen mörkare eller ljusare utan att ändra nyansen, och justering av mättnad ändrar färgstyrkan.
Användningsområden för färgkonvertering för utvecklare
Utvecklare konverterar färger när de bygger designsystem, implementerar teman, genererar färgpaletter och felsöker CSS. Designtokens lagrar ofta färger i hex; konvertering till RGB eller HSL möjliggör beräkningar i realtid, såsom opacitetslager eller tillgänglighetskontroller av kontrast. Temaväljare kan behöva härleda ljusare eller mörkare varianter från en basfärg med hjälp av HSL. Automatiserade tillgänglighetsverktyg konverterar färger för att beräkna luminans och kontrastförhållanden. Vid felsökning av layout eller teman hjälper det att se ett hex-värde som RGB eller HSL för att identifiera vilken kanal som är felaktig. Färgkonvertering används också i datavisualisering, diagrambibliotek och dynamisk UI-tematisering.
Vanliga frågor
Kan jag ange en 3-siffrig hex-kod?
För närvarande förväntar sig detta verktyg en 6-siffrig kod. För 3-siffriga förkortningar som F60, expandera den till FF6600 först.
Vad är HSL?
HSL står för Hue, Saturation, Lightness. Det är ett alternativt sätt att beskriva färger som vissa designers finner mer intuitivt än RGB.