Ga naar hoofdinhoud
LibraTool logoLibraTool

Gratis Kleurconverter

Converteer kleuren direct tussen HEX-, RGB-, HSL-, HSV- en CMYK-formaten. Inclusief een helderheidsschaal en vooraf ingestelde stalen.

Werkt offline na het laden

Converteer een kleur tussen HEX, RGB, HSL, HSV en CMYK — met een live voorbeeld en één-taps kopiëren. Alles wordt in uw browser uitgevoerd.

Accepteert: HEX (#fff of #ffffff), RGB (255, 255, 255) of HSL (360, 100%, 50%)

100%
Voorinstellingen:
HEX#14B8A6
rgb() · klassiekrgb(20, 184, 166)
rgb() · modernrgb(20 184 166)
hsl() · klassiekhsl(173, 80%, 40%)
hsl() · modernhsl(173 80% 40%)
oklch()oklch(70.4% 0.123 182.5)
lab()lab(67.1% -42.9 -2.3)
lch()lch(67.1% 43.0 183.1)
hsv()hsv(173, 89%, 72%)
cmyk()cmyk(89%, 0%, 10%, 28%)
RGB-waarden20, 184, 166

WCAG-contrast

Op witte achtergrond

2,49:1

Onvoldoende

Op zwarte achtergrond

8,44:1

AAA
🖨️ Voor afdruk: Deze CMYK-waarden (89%, 0%, 10%, 28%) zijn een standaard sRGB→CMYK-benadering ter referentie. Voor nauwkeurige afdrukkleur, gebruik het ICC-profiel van uw printer of een afgedrukt proefexemplaar — CMYK op een scherm kan niet elke inkt/papier-combinatie evenaren.

Helderheidsschaal

Klik op een kleurveld om naar die tint te schakelen

Veelvoorkomend gebruik

  • Zet Kleuren om voor WebdesignHaal HEX-, RGB- en HSL-waarden op voor elke kleur — klaar om in CSS of Tailwind te plakken.
  • Zet Kleuren om voor Afdrukken (CMYK)Zet schermkleuren (HEX/RGB) om in CMYK-waarden voor gebruik in printontwerp en professionele afdrukken.
  • Bouw Kleurenpaletten voor OntwerpsystemenZet merktkleuren om over alle formaten en genereer consistent helderheidsschalen voor een compleet ontwerpsysteem.
  • Controleer Kleurcontrast voor ToegankelijkheidConverteer kleuren om RGB-waarden op te halen voor gebruik in contrastraatgereedschappen - WCAG-conformiteit voor toegankelijk ontwerp.
  • Converteer Kleuren voor FigmaKrijg exacte HEX- en RGB-waarden om in Figma-kleurkiezers en ontwerptoken-systemen in te plakken.

Hoe het werkt

Alle omzettingslogica is zelfgeschreven JavaScript dat volledig in je browser draait — geen bibliotheek, geen serveraanroep. De tool parst je invoer, stuurt die door een reeks pure wiskundige functies en levert tegelijk elf uitvoerformaten, waaronder de moderne CSS Color 4-ruimtes oklch() en lab().

  1. 1
    Flexibel parsen van invoer
    Een eigen parser accepteert hex (3, 4, 6 of 8 cijfers), rgb()/rgba(), hsl()/hsla() in zowel de oude syntaxis met komma's als de moderne met spaties, en losse numerieke drietallen. Alfawaarden als decimaal of percentage worden genormaliseerd naar het bereik 0–1 voordat de omzetting begint.
  2. 2
    RGB als centrale omzettingsvorm
    Elk geaccepteerd formaat wordt eerst omgezet naar een canoniek RGB-drietal. Vanuit die ene representatie waaiert de tool uit: HSL en HSV gebruiken de standaard min/max/chroma-formules; CMYK wordt afgeleid door het key-kanaal te bepalen; en sRGB-linearisatie (de stuksgewijze gammacurve uit IEC 61966-2-1) wordt toegepast vóór de berekeningen in perceptuele ruimtes.
  3. 3
    Perceptuele kleurruimtes vanaf nul berekend
    oklch() wordt berekend met de 3×3-referentiematrices van Björn Ottosson (LMS-ruimte met derdemachtswortel). lab() en lch() gebruiken Bradford-chromatische adaptatie om van het witpunt D65 naar D50 om te rekenen, zoals CSS Color 4 lab() definieert. Dit zijn dezelfde formules die rendering-engines van browsers gebruiken — hier geïmplementeerd zonder externe afhankelijkheid.
  4. 4
    WCAG-contrast en lichtheidsschaal
    De relatieve luminantie wordt berekend volgens de WCAG 2.1-formule (gelineariseerde R, G, B gewogen 0.2126/0.7152/0.0722) en de contrastverhouding tegenover wit en zwart krijgt het oordeel AA-groot, AA, AAA of Onvoldoende. Een lichtheidsstrook van negen stappen ontstaat door het HSL-lichtheidskanaal van 10% tot 90% te laten oplopen; klik op een staal om die tint om te rekenen.

Gerelateerde tools

Veelgestelde vragen