In dit artikel
Kleurformaten uitgelegd
Kleuren in digitaal ontwerp en webontwikkeling worden weergegeven in meerdere formaten die passen bij verschillende contexten. HEX (#ff5733) is beknopt en universeel voor het web. RGB (255, 87, 51) is intuïtief voor het mengen van kleuren. HSL (14°, 100%, 60%) is het meest leesbaar voor mensen bij het aanpassen van tint, verzadiging en helderheid.
Verschillende tools gebruiken verschillende kleurformaten — ontwerpsoftware heeft vaak de voorkeur voor HSL, HTML/CSS gebruikt HEX en RGB, JavaScript-kleurenbibliotheken kunnen diverse formaten gebruiken, en drukontwerp gebruikt CMYK. Nauwkeurig omzetten tussen deze formaten vereist wiskundige formules.
Hoe kleurconversie werkt
De converter past nauwkeurige wiskundige transformaties toe tussen kleurruimten.
- HEX-parsing — decodeert 3-cijferige en 6-cijferige hex-codes, met of zonder alfakanaal
- RGB-normalisatie — verwerkt gehele getallen van 0-255 en zwevende-kommarepresentaties van 0-1
- HSL-berekening — converteert naar/van tint (0-360°), verzadiging (0-100%) en helderheid (0-100%)
Probeer gratis — geen aanmelding vereist
Een kleur converteren →Wanneer kleurconversie gebruiken
Kleurconversie is nodig wanneer kleuren tussen verschillende tools, formaten of contexten worden overgebracht.
- Ontwerp naar code — converteer Figma/Sketch HSL-kleurwaarden naar HEX voor CSS-implementatie
- Merkconsistentie — verifieer dat kleurwaarden overeenkomen in verschillende ontwerphulpmiddelen en code-implementaties
- Toegankelijkheid — bereken contrastratios (die relatieve luminantie uit RGB-waarden gebruiken) voor WCAG-naleving
Veelgestelde vragen
Wat is het verschil tussen RGB en RGBA?
RGBA voegt een alfakanaal toe aan RGB dat dekking vertegenwoordigt van 0 (volledig transparant) tot 1 (volledig ondoorzichtig), of 0-255 in sommige contexten. Op vergelijkbare wijze voegt HEXA twee hex-cijfers toe voor alfa (bijv. #FF5733FF voor volledig ondoorzichtig of #FF573380 voor 50% dekking). Alfawaarden maken transparante en semi-transparante kleuren mogelijk.
Waarom levert het omzetten van een kleur en terug niet altijd precies dezelfde waarde op?
Kleurruimteconversie omvat rekenkunde met drijvende komma en afronding. Retourconversies (RGB → HSL → RGB) kunnen kleine afrondingsfouten hebben in het laatste cijfer. Dit is normaal en het verschil is voor het menselijk oog niet waarneembaar. Sla kleuren voor precisiekritisch werk altijd op in één canoniek formaat.
Wat is het verschil tussen HSL en HSV/HSB?
HSL (Hue, Saturation, Lightness) en HSV/HSB (Hue, Saturation, Value/Brightness) zijn verschillende cilindrische kleurmodellen. In HSL is vol wit L=100% ongeacht de verzadiging; in HSV is vol wit S=0%, V=100%. HSL is intuïtiever voor webontwerp; HSV wordt vaak gebruikt in kleurkiezer UI-elementen.