HEX naar HSL converter
Zet een HEX-kleurcode om naar kleurtoon, verzadiging en lichtheid om makkelijk lichtere en donkerdere tinten te maken.
hex-invoer
Resultaat · HSL
hsl(344, 100%, 62%)
HEX
#FF3D72
RGB
rgb(255, 61, 114)
HSV
hsv(344, 76%, 100%)
CMYK
cmyk(0%, 76%, 55%, 0%)
Zo werkt het: HEX naar HSL
- 1
Voer een kleur in
Typ een kleurcode of kies een kleur met de kleurkiezer — elk veld accepteert het formaat dat erbij staat.
- 2
Bekijk de conversie
Het resultaat wordt direct bijgewerkt terwijl je typt, samen met een live voorbeeld van de kleur.
- 3
Kopieer de code
Kopieer de gewenste waarde met één klik en plak hem in je ontwerp, CSS of afdrukinstellingen.
HEX- en HSL-kleuren
HEX is de manier waarop kleuren in CSS en ontwerptools worden geschreven: een # gevolgd door drie paren hexadecimale tekens voor rood, groen en blauw. HSL beschrijft dezelfde kleur zoals mensen erover denken — kleurtoon als hoek op het kleurenwiel van 0 tot 360°, verzadiging en lichtheid in procenten.
Omzetten naar HSL is handig als je variaties van één kleur nodig hebt: houd de kleurtoon gelijk en wijzig de lichtheid voor lichtere en donkerdere tinten voor hovertoestanden, achtergronden en randen. Browsers begrijpen beide notaties, bijvoorbeeld hsl(342, 100%, 62%). Plak een code van drie of zes tekens, met of zonder #-teken, en kopieer het hsl()-resultaat; RGB, HSV en CMYK worden ook getoond.
Alles draait lokaal in je browser — je afbeeldingen worden nooit naar een server geüpload.