HSL till HEX-omvandlare
Vad är HSL till HEX-omvandlare
Det här verktyget omvandlar HSL-värden (Hue, Saturation, Lightness) till HEX-färgkoder. Ange nyans (0–360°), mättnad (0–100 %) och ljushet (0–100 %) och få motsvarande HEX-kod. Det är användbart när du har designat en palett i ett HSL-baserat verktyg och behöver HEX-strängen till en CSS-fil eller designspecifikation.
Så använder du
- Ange värdena för nyans (0–360), mättnad (0–100) och ljushet (0–100) i HSL-fälten.
- HEX-koden och RGB-värdena uppdateras direkt.
- Klicka på kopiera-knappen bredvid HEX för att kopiera koden #RRGGBB.
- Växla mellan alla 6 färgomvandlare med lägeslänkarna högst upp.
När du använder det
Valde du en färg i en HSL-färgväljare men ditt Tailwind-tema behöver HEX? Ange hsl(217, 91%, 60%) och kopiera #3B82F6 direkt in i din tailwind.config.js. Det slipper dig gissa omvandlingen när du finjusterar en egen färg och sedan måste ge den till CSS.
Vanliga frågor
Vad är hsl(0, 100%, 50%) i HEX?
hsl(0, 100%, 50%) är #ff0000 — rent rött. Nyans 0° med full mättnad och 50 % ljushet ger det renaste röda.
Vad är hsl(0, 0%, 100%) i HEX?
hsl(0, 0%, 100%) är #ffffff — vitt. 100 % ljushet är alltid vitt oavsett nyans eller mättnad.
Vad är hsl(0, 0%, 0%) i HEX?
hsl(0, 0%, 0%) är #000000 — svart. 0 % ljushet är alltid svart.
Varför kan mitt HSL till HEX-resultat skilja sig något från andra verktyg?
Avrundning i mellanliggande beräkningar kan ge en skillnad på en siffra i HEX (t.ex. #3B82F6 mot #3B82F7). Det är en ±1-avrundningsskillnad och är visuellt omärklig. Vår omvandlare använder standardavrundning för att minimera detta.
Kan jag dela verktyget med mina värden ifyllda?
Ja. Webbadressen uppdateras automatiskt medan du skriver. Kopiera den från adressfältet eller använd Dela-knappen — den som öppnar länken ser exakt dina värden redo att användas.
Relaterade verktyg
HEX till HSL-omvandlare
Omvandla HEX-färgkoder till HSL-värden direkt. Gratis HEX till HSL-omvandlare med live-förhandsvisning. Perfekt för CSS-variabler och teman.
Bildförhållande Kalkylator
Räkna ut bildförhållandet, hitta saknad bredd eller höjd och ändra storlek på bilder och video utan att förvränga proportionerna. Gratis.
Base64-avkodare
Avkoda Base64-strängar till vanlig text direkt i din webbläsare. Stöder fullständig Unicode-utdata inklusive emojis. Gratis Base64-avkodare online.