PK Systems PK Systems
Kleurtools

Kleuromzetter

Converteer in real time tussen HEX, RGB, HSL, HSV en CMYK. Kies een kleur of plak een waarde — elk formaat werkt bij tijdens typen.

Kleuromzetter

Tints en shades

Over kleurmodellen

Elk formaat op deze pagina beschrijft dezelfde kleur in een andere taal. HEX en RGB spreken de rode, groene en blauwe lichtkanalen van je scherm direct aan — ze zijn onderling uitwisselbaar. HSL en HSV herorganiseren die info naar tint, verzadiging en een lightness- of value-as, wat intuïtiever voelt om een tint lichter, donkerder of gedraaid te maken. CMYK is het printmodel: cyaan, magenta, geel en zwart trekken licht weg van wit papier, dus de schermpreview is een benadering van hoe de kleur zal afdrukken.

Hoe gebruik je deze converter

Pak een kleur uit de native picker of typ een waarde in een willekeurig veld — HEX accepteert #RGB en #RRGGBB, RGB accepteert rgb(r, g, b), en HSL accepteert hsl(h, s%, l%). De andere rijen verversen direct. Gebruik Kopiëren naast elk formaat om de waarde naar je klembord te sturen. De vijf swatches onder het formulier preview dezelfde tint op 10%, 30%, 50%, 70% en 90% lightness — klik er een om die variant in het formulier te laden.

Snelle formaatreferentie

Gebruik HEX in CSS, designtools en huisstijl-richtlijnen — het is de meest compacte schriftvorm. Gebruik RGB als je een transparante variant wilt: stap over op rgba(r, g, b, a) met alpha tussen 0 en 1. Gebruik HSL bij het handmatig bouwen van paletten — tint en verzadiging vasthouden en alleen lightness wijzigen geeft tints en shades die als familie lezen. Gebruik CMYK alleen als je drukwerk levert, en vraag de drukkerij om een exacte spec — elk drukkersprofiel verschuift kleuren iets.

Veelgestelde vragen

Is deze conversie exact?
HEX, RGB, HSL en HSV beschrijven schermkleuren en doen round-trip zonder verlies, op de kleine afronding bij 8-bit-kanalen na. CMYK is een benadering: echte druk hangt af van het kleurprofiel van de printer, het papier en de inktset, dus gebruik de CMYK-uitvoer als startpunt en bevestig met een proefdruk.
Wat is het verschil tussen HSL en HSV?
Beide delen tint en verzadiging als assen, maar de derde verschilt. In HSL is lightness 0% zwart en 100% wit, met de pure tint op 50%. In HSV is value 100% de pure tint en 0% zwart — er is geen ingebouwd pad naar wit. HSL voelt natuurlijker voor het kiezen van tints en shades; HSV voelt natuurlijker voor het kiezen van hoe fel een tint moet branden.
Waarom ziet mijn HEX er anders uit op druk?
Schermen zenden licht additief uit (RGB), drukkers absorberen licht subtractief (CMYK). Levendige blauwen, groenen en oranjes die op scherm makkelijk bestaan vallen vaak buiten het CMYK-gamut. Check altijd een proefdruk voor goedkeuring en vraag je drukker of ze CMYK willen of, idealiter, een Pantone-referentie voor merkkleuren.
Mag ik elke CSS-kleurstring plakken?
De HEX-, RGB- en HSL-velden accepteren de gangbaarste CSS-vormen — #RGB, #RRGGBB, rgb(...), rgba(...), hsl(...), hsla(...). Benoemde kleuren als tomato en moderne oklch()-waarden worden nog niet geparsed — converteer die eerst in DevTools van je browser.
Worden de geconverteerde waarden ergens opgeslagen?
Nee. Conversie draait volledig in je browser; niets wordt naar een server gestuurd, en waarden worden niet bewaard tussen bezoeken. Bookmark of kopieer elk palet dat je wilt behouden.
Waarom zijn de tints op HSL-lightness gebaseerd?
Tint en verzadiging gelijk houden en alleen HSL-lightness verschuiven geeft een tonale schaal die visueel consistent voelt — het type schaal dat je met de hand zou bouwen voor een UI-palet. De vijf samples op 10%, 30%, 50%, 70% en 90% geven een snelle spread van een diepe shade tot een bijna-witte tint van dezelfde kleurfamilie.