Konvertera HSL till HEX
Ställ in nyans, mättnad och ljushet och få motsvarande HEX-färgkod med sex tecken, redo att kopiera.
hsl-värde
Resultat · HEX
#FF3D77
RGB
rgb(255, 61, 119)
HSL
hsl(342, 100%, 62%)
HSV
hsv(342, 76%, 100%)
CMYK
cmyk(0%, 76%, 53%, 0%)
Så här gör du: HSL till HEX
- 1
Ange en färg
Skriv en färgkod eller välj en färg med färgväljaren — varje fält accepterar formatet som visas.
- 2
Se konverteringen
Resultatet uppdateras direkt medan du skriver, tillsammans med en live-förhandsvisning av färgen.
- 3
Kopiera koden
Kopiera värdet du behöver med ett klick och klistra in det i din design, CSS eller dina utskriftsinställningar.
Därför konverterar man HSL till HEX
HSL är det mest intuitiva sättet att bygga ett färgsystem. Du låser en nyans, till exempel 262° för violett, och skapar en hel skala genom att främst ändra ljusheten: runt 95 % för bakgrunder, 58 % för knappar och accenter, 30 % för text. Designers och utvecklare använder den metoden för ljusare toner, mörkare nyanser och mörka teman.
Den färdiga skalan måste dock oftast levereras som HEX-koder: grafiska profiler, design tokens, Figma-bibliotek, varumärkesmanualer och många publiceringssystem förväntar sig värden i formatet #RRGGBB. Ange HSL-värdena och kopiera HEX-resultatet – hsl(262, 83%, 58%) blir till exempel #7C3BED. Verktyget visar även RGB, HSV och CMYK för samma färg. Eftersom HEX bara kan lagra 256 nivåer per kanal ändrar mycket små ändringar i HSL inte alltid HEX-koden.
Allt körs lokalt i din webbläsare — dina bilder laddas aldrig upp till någon server.