Kleuren converteren tussen HEX, RGB, HSL en andere indelingen
Converteer een kleur tussen HEX, RGB, HSL, CMYK en andere indelingen, ontdek welke conversies exact zijn en leer welke indeling je wanneer gebruikt.
2 min leestijd
Plak de kleur in de kleurconverter. Kies de gewenste indeling bij Doel en kopieer het resultaat. De tool herkent zelf de indeling van de invoer. #ff6600, rgb(255, 102, 0), orangered en zelfs 255, 102, 0 werken allemaal. Het resultaat verschijnt terwijl je typt. Een kleurstaal onder het resultaat laat zien of de tool de juiste kleur heeft gelezen.
Dezelfde kleur in vier indelingen
HEX, RGB, HSL en CMYK zijn verschillende manieren om dezelfde kleur weer te geven. Hier zie je één oranje kleur in alle vier de indelingen:
| Indeling | Waarde | Betekenis van de getallen |
|---|---|---|
| HEX | #ff6600 |
Rood, groen en blauw, elk als twee hexadecimale cijfers |
| RGB | rgb(255, 102, 0) |
Rood, groen en blauw, van 0 tot 255 |
| HSL | hsl(24, 100%, 50%) |
Tint op het kleurenwiel, verzadiging, lichtheid |
| CMYK | cmyk(0%, 60%, 100%, 0%) |
Cyaan, magenta, gele en zwarte inkt |
HEX en RGB gebruiken dezelfde drie getallen, maar schrijven die anders. De conversie ertussen is exact. HSL is makkelijker met de hand aan te passen: verhoog de waarde voor lichtheid en de kleur wordt lichter.
Waarom CMYK anders is
CMYK is bedoeld voor drukwerk. De exacte waarden hangen af van de printer, het papier en de inkt. De converter gebruikt de standaardformule zonder printerprofiel, dus een drukker kan voor dezelfde kleur iets andere waarden geven. Gebruik het CMYK-resultaat voor mock-ups en vraag de drukker om een proefdruk voordat je de echte oplage laat drukken.
Welke indeling gebruik je?
- CSS en HTML: gebruik HEX. Het is kort en elke browser kan het lezen.
- Een kleurthema: gebruik HSL. Je maakt lichtere en donkerdere tinten door één getal aan te passen.
- Transparantie in code: gebruik RGB met een alfawaarde of HEX met acht cijfers.
rgba(37, 99, 235, 0.5)wordt#2563eb80, waarbij de laatste twee cijfers de dekking aangeven. - Mock-ups voor drukwerk: gebruik CMYK en houd rekening met de opmerking hierboven.
Kleurnamen zijn niet exact
De converter ondersteunt 17 indelingen, waaronder OKLCH, LAB, HSV, CSS-kleurnamen en ANSI-codes voor terminals. Een kleurnaam als resultaat is de dichtstbijzijnde CSS-kleurnaam, geen exacte overeenkomst. #ff6600 wordt orangered, maar orangered is eigenlijk #ff4500. Gebruik kleurnamen voor snelle labels en exacte waarden voor merkkleuren.
Plak de kleur, controleer de kleurstaal en kopieer het resultaat. Dat is alles.
Klaar om het zelf te proberen?
Kleurconverter
Zet kleuren om tussen HEX, RGB, HSL, HSV, HWB, CMYK, LAB, LCH, OKLab, OKLCH, XYZ, CSS-kleurnamen, ANSI-terminalcodes en meer, met automatische formaatherkenning en een live voorbeeld.