Ctrl K

Kleurcode converter

Zet een kleur om tussen HEX, RGB, HSL en CMYK. Typ of plak een code, kies een kleur met de kleurkiezer, of pas een van de waarden aan: alle andere formaten worden direct bijgewerkt. Daaronder zie je of witte of zwarte tekst op deze kleur goed leesbaar is.

Plak een code in een ander formaat en de rest wordt ingevuld. Ook een CSS-kleurnaam werkt.

of kies een kleur
RGB
HSL
CMYK
  • HEX
  • RGB
  • HSL
  • CMYK

Leesbaarheid van tekst op deze kleur

Witte tekst
Zwarte tekst

Zo werkt het

  1. Geef een kleur op

    Typ of plak een code (#1e90ff, rgb(30, 144, 255), hsl(...)) of een kleurnaam, of kies een kleur met de kleurkiezer.

  2. Zie alle formaten

    Direct staan HEX, RGB, HSL en CMYK er netjes naast. Pas een waarde aan en de rest verandert mee.

  3. Kopieer wat je nodig hebt

    Met één klik kopieer je de code voor je CSS, ontwerp of drukwerk. Eronder zie je of witte of zwarte tekst goed leesbaar is.

De formaten

  • HEX (#1e90ff) is de gangbare schrijfwijze op het web. De drie paren cijfers zijn de hoeveelheid rood, groen en blauw, van 00 tot ff. Een korte vorm als #f80 is hetzelfde als #ff8800.
  • RGB (rgb(30, 144, 255)) geeft rood, groen en blauw als getal van 0 tot 255.
  • HSL (hsl(210, 100%, 56%)) geeft tint (0 tot 360 graden op het kleurenwiel), verzadiging en lichtheid. Handig als je een kleur lichter of donkerder wilt maken zonder de tint te veranderen.
  • CMYK (cmyk(88%, 44%, 0%, 0%)) is de notatie van drukwerk: cyaan, magenta, geel en zwart.

Wat voor invoer werkt?

In het bovenste veld kun je een code in elk formaat plakken: #1e90ff, 1e90ff, #f80, rgb(30 144 255), hsl(210, 100%, 56%) of een naam als dodgerblue. Een transparantiewaarde (alfa) wordt genegeerd.

Leesbaarheid van tekst

Onder het resultaat staat het contrast van de kleur met wit en met zwart, volgens de richtlijnen voor toegankelijkheid (WCAG). Een verhouding van 4,5 : 1 of meer is goed leesbaar voor gewone tekst (niveau AA), 7 : 1 of meer is uitstekend (AAA), en vanaf 3 : 1 kan grote tekst nog. Gebruik het om te kiezen tussen een witte of zwarte tekstkleur.

Goed om te weten

De omrekening naar CMYK is een gewone wiskundige formule. Drukkers werken met kleurprofielen, dus de gedrukte kleur kan afwijken van wat je op je scherm ziet.

Veelgestelde vragen

Wat is het verschil tussen HEX, RGB en HSL?

HEX en RGB beschrijven dezelfde kleur als een mix van rood, groen en blauw (HEX in hexadecimale cijfers). HSL beschrijft hem als tint, verzadiging en lichtheid, wat handiger is om een kleur lichter of donkerder te maken.

Is de CMYK-waarde precies wat de drukker krijgt?

Nee. Dit is de gangbare wiskundige omrekening van RGB naar CMYK. Drukkers gebruiken kleurprofielen, dus het gedrukte resultaat kan afwijken. Vraag bij drukwerk altijd om een proef.

Welke kleurnamen werken?

Alle CSS-kleurnamen, zoals dodgerblue, tomato of rebeccapurple. De namen komen uit je browser.

Wordt mijn kleur opgeslagen?

Nee. Alles gebeurt in je browser.