HSL naar RGB Omzetten

HSL
Invoer
H
S%
L%
RGB
Resultaat
R
G
B
HEX

Wat is het HSL naar RGB Omzetten

Deze tool zet HSL-waarden (Hue 0–360°, Saturation 0–100%, Lightness 0–100%) om naar RGB-waarden (Rood, Groen, Blauw, elk 0–255). Gebruik het wanneer je een kleur in HSL-formaat hebt — gangbaar in CSS en designsystemen — en het RGB-equivalent nodig hebt voor JavaScript, beeldverwerking of designtools die losse kanaalwaarden vereisen.

Hoe te gebruiken

  1. Voer de Hue (0–360), Saturation (0–100) en Lightness (0–100) in de HSL-velden in.
  2. RGB- en HEX-waarden worden direct bijgewerkt.
  3. Klik op de kopieerknop naast RGB om het formaat rgb(r, g, b) te kopiëren.
  4. Wissel tussen alle 6 omzetters via de moduslinks bovenaan.

Wanneer te gebruiken

Loop je in JavaScript de kleurtoon van 0–360 door voor een regenboogeffect, maar zit je vast bij het schrijven van pixels in een Canvas ImageData-buffer? Die buffer wil losse R-, G-, B-bytewaarden, geen hsl()-string. Zet hier elke hsl()-uitvoer om naar rgb() en je krijgt de losse kanaalgetallen, klaar voor de array.

Veelgestelde vragen

Wat is hsl(120, 100%, 50%) in RGB?

hsl(120, 100%, 50%) is rgb(0, 255, 0) — zuiver groen. Hue 120° is groen op de kleurencirkel; 100% verzadiging en 50% lichtheid geven het zuivere groen.

Wat is hsl(240, 100%, 50%) in RGB?

hsl(240, 100%, 50%) is rgb(0, 0, 255) — zuiver blauw.

Wat is hsl(60, 100%, 50%) in RGB?

hsl(60, 100%, 50%) is rgb(255, 255, 0) — zuiver geel.

Wanneer gebruik ik HSL naar RGB in plaats van HSL naar HEX?

Gebruik HSL naar RGB bij API's of libraries die losse numerieke kanaalwaarden vereisen — zoals Canvas ImageData, WebGL, Three.js-kleurconstructors of beeldverwerkingslibraries. Gebruik HSL naar HEX wanneer je een CSS-string of hexcode nodig hebt.

Kan ik deze tool delen met mijn ingevulde gegevens?

Ja. De URL wordt automatisch bijgewerkt terwijl je typt. Kopieer de link uit de adresbalk of gebruik de Deel-knop — iedereen die de link opent, ziet jouw gegevens al ingevuld.

Gerelateerde tools