tigtools

Kleurconverter

Typ of plak een kleur in een ondersteunde indeling, of kies een kleur. Alle andere indelingen worden direct bijgewerkt.

Werkt in je browser Geen registratie nodig

Geïnterpreteerd als HEX.

HEX
#336699
RGB
rgb(51, 102, 153)
HSL
hsl(210, 50%, 40%)
HWB
hwb(210 20% 40%)
OKLCH
oklch(49.93% 0.0987 250.43)
CMYK
cmyk(66.7%, 33.3%, 0%, 40%)

CMYK wordt hier met een eenvoudige formule berekend en houdt geen rekening met kleurbeheer. Gebruik voor drukwerk het ICC-profiel van je printer.

Zo gebruik je deze tool

  1. Typ of plak een kleur, bijvoorbeeld #1e90ff, rgb(30 144 255) of oklch(65% 0.18 250). Je kunt ook op de kleurkiezer klikken.
  2. Controleer het kleurstaal om zeker te weten dat het de verwachte kleur is.
  3. Kopieer de gewenste indeling uit de lijst. Waarden met transparantie behouden hun alfa.

Hoe het werkt

Geaccepteerde invoer: HEX met 3, 4, 6 of 8 cijfers (het 4e en 8e cijfer staan voor alfa), rgb() en rgba() met getallen of percentages, hsl() en hsla(), hwb(), oklch() en cmyk() met percentages of getallen van 0 tot 100. Zowel de klassieke syntaxis met komma’s als de moderne syntaxis met spaties en “/ alpha” werkt. Voor de tint kun je deg, turn, rad en grad gebruiken. Kleurnamen zoals “tomato” worden niet herkend; gebruik de kleurkiezer of voer een code in.

Alle conversies verlopen via sRGB. HSL en HWB zijn eenvoudige omzettingen van de RGB-waarden en worden daarom exact omgerekend. OKLCH is een perceptuele kleurruimte: gelijke stappen in de lichtheid zien er ongeveer even verschillend uit, waardoor deze ruimte handig is om paletten samen te stellen. De berekening gebruikt de gepubliceerde OKLab-matrices. Sommige OKLCH-kleuren vallen buiten het bereik dat sRGB kan weergeven. De tool geeft dat aan en toont de dichtstbijzijnde kleur die wel kan worden weergegeven.

CMYK wordt berekend met de gebruikelijke eenvoudige formule (K = 1 − het grootste RGB-kanaal). Het resultaat van echt drukwerk hangt af van papier, inkt en het ICC-profiel. Gebruik deze waarden daarom als uitgangspunt, niet als drukspecificatie.

Voorbeelden

Van een HEX-huiskleur naar CSS

In een huisstijlhandboek staat #0b5d1e. Plak de code om rgb(11, 93, 30) te krijgen voor oudere CSS, hsl(133.9, 78.8%, 20.4%) om de lichtheid handmatig aan te passen, en een oklch()-waarde voor moderne CSS-kleurfuncties.

Een kleur met transparantie bekijken

rgba(0, 0, 0, 0.5) wordt omgezet naar #00000080. De laatste twee HEX-cijfers (80) geven de alfa aan: 128 van de 255, ongeveer 50 %.

Een OKLCH-waarde uit een ontwerpbestand controleren

oklch(70% 0.4 150) is een zeer verzadigde groene kleur die sRGB-schermen niet kunnen weergeven. De tool geeft dit aan en toont de dichtstbijzijnde sRGB-kleur, zodat je weet dat het ontwerp er op de meeste schermen anders uitziet.

Veelgestelde vragen

Waarom verandert de HEX-code soms één stap als ik een kleur naar HSL en terug omzet?

HEX slaat per kanaal gehele getallen van 0 tot 255 op. Waarden in andere indelingen worden afgerond voor weergave (HSL op één decimaal). Als je een afgeronde waarde terug omzet, kan die één stap afwijken. Kopieer de HEX-code als je het origineel exact nodig hebt.

Is de CMYK-waarde geschikt voor drukwerk?

Nee, niet op zichzelf. De berekening gebruikt een eenvoudige formule zonder kleurprofiel. Drukkers gebruiken profielen zoals FOGRA of GRACoL, die andere waarden opleveren. Vraag het daarom na bij je drukker of converteer de kleur in een kleurbeheerde toepassing.

Wat is OKLCH en kan ik het gebruiken in CSS?

OKLCH beschrijft een kleur aan de hand van de waargenomen lichtheid, chroma (kleurintensiteit) en tint. Huidige versies van de belangrijkste browsers ondersteunen oklch() in CSS. Gebruik een HEX- of rgb()-fallback als je ook oudere browsers ondersteunt.

Wat betekent een HEX-code van 8 cijfers?

#RRGGBBAA: de laatste twee cijfers geven de dekking aan, van 00 (volledig transparant) tot ff (volledig ondoorzichtig). De 4-cijferige notatie #RGBA werkt hetzelfde, met één cijfer per kanaal.

Privacy

Kleuren worden in je browser omgerekend. Wat je invoert, wordt nergens naartoe verzonden of opgeslagen.