Generator voor Tinten en Schaduwen
Genereer automatisch de lichtste tinten en donkerste schaduwen van elke kleur, met de HEX-code.
Hoe tinten en schaduwen van een kleur genereren
Kies een basiskleur
Selecteer de startkleur met de visuele kleurkiezer of voer de HEX-code in.
Bekijk de tinten en schaduwen
Je ziet automatisch 5 lichtere tinten en 5 donkerdere schaduwen die uit je kleur worden gegenereerd.
Kopieer de HEX die je nodig hebt
Klik op een willekeurig kleurvak om de HEX-code naar het klembord te kopiëren.
Veelgestelde vragen over de generator voor tinten en shades
Het hebben van lichtere en donkerdere varianten van een kleur is essentieel voor het maken van een coherent ontwerppalette (bijvoorbeeld voor hover-states, achtergronden of randen). Deze tool berekent deze automatisch.
Wat is het verschil tussen een tint en een shade?
+
Een tint wordt verkregen door de kleur met wit te mengen (helderder maken) en een schaduw door deze met zwart te mengen (donkerder maken).
Hoeveel varianten genereert het?
+
Het genereert 5 lichtere tinten en 5 donkerdere schaduwen uit jouw basiskleur, 10 in totaal.
Kan ik de codes kopiëren?
+
Ja, klik op elke kleur in de lijst om de HEX-code te kopiëren.
Kan ik hiermee een ontwerppalette zoals Tailwind maken?
+
Ja, het is precies hetzelfde concept als de kleurschalen 50-900 die veel ontwerpstelsels gebruiken.
Is het gratis?
+
Ja, deze tool is volledig gratis.
Wordt mijn kleur naar een server geüpload?
+
Nee, alle berekeningen worden rechtstreeks in je browser uitgevoerd.
Kleuren
Kleurconverter (HEX, RGB, HSL, CMYK)
Converteer elke kleur onmiddellijk tussen HEX, RGB, HSL en CMYK, met live preview en de dichtstbijzijnde kleurnaam.
Kleurenpaletgenerator
Maak harmonieuze paletten van 5 kleuren (complementair, analogisch, triadisch of monochromatisch) op basis van een basiskleur.
CSS Gradiënt Generator
Maak lineaire of radiale gradiënten met tot 4 kleuren en kopieer de kant-en-klare CSS-code.
WCAG-contrastchecker
Controleer of de kleurcombinatie van tekst en achtergrond voldoet aan de toegankelijkheidsniveaus AA en AAA.
Willekeurige kleur
Genereer een willekeurige kleur met één klik en ontdek de naam, HEX/RGB/HSL-code en soortgelijke kleuren.
Kleurkiezer (pipet)
Kies elke kleur van je scherm met de browser-pipet tool, of gebruik de klassieke kleurkiezer.
Kleurenblindheid Simulator
Upload een afbeelding en zie hoe deze eruit ziet voor mensen met protanopie, deuteranopie of tritanopie.
Mesh Gradient Generator
Maak achtergronden met mesh-gradiënten (vervaagde kleurvlekken) en download ze als PNG of kopieer de CSS-code.
Kleurenmixer
Meng twee kleuren en ontdek de tussenliggende tinten stap voor stap, met hun HEX-code.
Kleurenwiel (Harmonieën)
Kies een kleur op het wiel en ontdek de harmonieuze combinaties: complementair, analoog, triadisch en meer.
Kleurenpaletextractor van Afbeelding
Upload een afbeelding en extraheer automatisch de dominante kleuren in een palet, met de HEX-code van elke kleur.
Gemiddelde Kleur van een Afbeelding
Upload een afbeelding en bereken direct de gemiddelde kleur, met HEX-, RGB- en HSL-codes.
Verken kleuren per familie
Meer dan 469 benoemde kleuren, met hun HEX-, RGB-, HSL- en CMYK-codes, georganiseerd in 12 kleurengroepen.
