Elke designer en developer stuit op deze obstakels bij het wisselen van kleurformaat.
Design-tools exporteren HEX, CSS verwacht HSL en drukwerk vereist CMYK. Zonder een betrouwbare kleurconverter gokt je handmatig of spring je van site naar site — en verspil je kostbare werktijd.
RGB handmatig naar HSL omrekenen vereist goniometrie. Eén typefout in de formule draait je tint 180° om. Color Math voert alle berekeningen onmiddellijk en foutloos uit.
De meeste kleurpickers negeren de contrastVereisten van WCAG 2.1. Color Math toont contrastverhoudingen direct, zodat toegankelijkheid al bij de eerste kleurkeuze wordt ingebakken.
Kleurvoorbeeld
#3B82F6
rgb(59, 130, 246)
Current
Complementair
Analoog
Triadisch
Klik op een tint om te laden
White text on color
Black text on color
Opgeslagen kleuren verschijnen hier
Eén kleurconverter voor alle systemen. Color Math vervangt meerdere tools tegelijk.
Bewerk een willekeurig veld — HEX, RGB, HSL of CMYK — en Color Math herberekent onmiddellijk alle andere formaten. Geen bevestiging nodig.
Sleep de schuifregelaars R, G, B, H, S, L, C, M, Y, K en zie alle formaten live bijwerken. Ideaal voor het verfijnen van tinten zonder het toetsenbord te gebruiken.
Color Math genereert complementaire, analoge en triadische paletten vanuit jouw kleur. Klik op een tint om die direct te laden.
Bekijk in één oogopslag de contrastverhoudingen op witte en zwarte achtergrond. Color Math toont AA, AAA of Niet geslaagd — voor een standaard toegankelijk ontwerp.
Elke opgeslagen kleur blijft tussen sessies in je browser bewaard. Color Math slaat tot 10 recente kleuren op om ze later te bekijken en te vergelijken.
Alle berekeningen van Color Math worden volledig in je browser uitgevoerd. Er worden geen gegevens verzonden en er is geen account nodig — jouw kleuren zijn alleen van jou.
Van de verbinding tussen ontwerp en code tot drukwerk en toegankelijkheid — Color Math past zich aan elke stap van je kleurworkflow aan.
Heb je een HEX uit Figma? Plak het in Color Math en krijg direct het HSL-equivalent voor je CSS-custom-properties. Pas de helderheid aan voor hover- en focustoestanden zonder het ontwerpbestand opnieuw te openen.
Color Math converteert je RGB-schermgrafiek naar theoretische CMYK-waarden om uit-gamut roden en oranje te ontdekken voordat je het bestand naar de drukker stuurt. Voorkom onaangename verrassingen zonder extra kosten.
Color Math berekent WCAG 2.1-contrastverhoudingen ten opzichte van wit en zwart in realtime. Weet direct of je tekstkleur voldoet aan AA- of AAA-niveaus — zonder extra tool.
Drie stappen om elke kleur te converteren, verkennen en opslaan.
Typ een HEX-code (afkortingen zoals #f00 worden automatisch uitgebreid) of sleep een schuifregelaar om te beginnen. Color Math accepteert tegelijkertijd HEX-, RGB-, HSL- en CMYK-invoer.
Schakel tussen de tabbladen RGB, HSL en CMYK om via schuifregelaars af te stellen. Scroll naar het Paletpaneel om de complementaire, analoge en triadische kleuren te zien die Color Math heeft gegenereerd.
Klik op een kopieerknop om het gewenste formaat te verkrijgen. Druk op Opslaan om de huidige tint aan de geschiedenis toe te voegen. Color Math bewaart tot 10 kleuren tussen sessies.
Antwoorden op de meest gestelde vragen over Color Math en kleurconversie.
Color Math is een gratis, browsergebaseerde kleurconverter die HEX-, RGB-, HSL- en CMYK-kleurcodes in realtime omzet. Het genereert ook kleurpaletten (complementair, analoog, triadisch) en berekent WCAG 2.1-contrastverhoudingen — alles zonder serververzoeken.
Color Math gebruikt een standaard wiskundige omrekening (RGB → CMYK) die een goede theoretische schatting geeft. De daadwerkelijke drukuitvoer is echter afhankelijk van printer, inkt, papier en ICC-kleurprofiel. Gebruik Color Math als referentie, niet als vervanging voor professioneel drukkleurenbeheer.
WCAG 2.1 definieert minimale contrastverhoudingen voor leesbare tekst. AA vereist 4,5:1 voor normale tekst en 3:1 voor grote tekst. AAA vereist 7:1 voor normale tekst. Color Math berekent deze verhoudingen ten opzichte van zuiver wit en zuiver zwart om je te helpen de juiste achtergrond te kiezen.
HSL (Tint, Verzadiging, Helderheid) sluit beter aan bij de manier waarop CSS kleuren definieert en hoe designers over tinten en schaduwen nadenken. Een helderheid van 50% in HSL geeft de zuiverste versie van een tint, waardoor het eenvoudig is lichtere of donkerdere varianten te maken door één waarde aan te passen.
Color Math slaat jouw kleuren alleen op in de localStorage van je browser — nooit op een server. De geschiedenis is lokaal opgeslagen op jouw apparaat en browserprofiel. Het wissen van je browsergegevens verwijdert deze geschiedenis.
Color Math berekent palletkleuren met HSL-kleurtheorie. Complementaire kleuren liggen 180° tegenover elkaar op het kleurwiel. Analoge kleuren liggen op ±30°. Triadische kleuren liggen op +120° en +240°. Verzadiging en helderheid blijven gelijk aan de bronkleur, wat een visueel samenhangend palet oplevert.
Ja. Color Math is volledig responsief. Schuifregelaars, invoervelden en het paletraster passen zich aan kleine schermen aan. Alle berekeningen zijn lokaal, dus er is geen vertraging op mobiele netwerken.
Geen registratie vereist. Werkt offline na de eerste keer laden.
