Zelf uitzoeken welke kleuren bij elkaar passen kost tijd. Deze generator gebruikt de klassieke harmonieen van de kleurencirkel - dezelfde tintverhoudingen die in kleurtheorie worden onderwezen - zodat elk palet wiskundig klopt in plaats van op gevoel gekozen. Klik op een kleurvlak om de hexcode te kopieren, of kopieer het hele palet als kant-en-klare CSS custom properties. Alles gebeurt client-side: geen account, geen upload, geen tracking van je merkkleuren.
Gratis Kleurenpalet Generator
Draait volledig in je browser - niets uploaden, geen account.
Harmonie
CSS-variabelen
Wat is een kleurenpalet generator?
Een kleurenpalet generator bouwt een bijpassend kleurenschema op basis van een kleur, met de kleurencirkel als uitgangspunt. Kies of typ een hexkleur, kies een harmonie zoals complementair, analoog, triadisch of monochroom, en direct verschijnen de bijpassende kleuren, elk met een kopieerbare hexcode. Alles draait in je browser.
Zo werkt het
- 1Stel je basiskleur in. Klik op het kleurvlak om visueel te kiezen, typ een hexcode zoals #6366f1, of klik op Willekeurig voor een nieuw startpunt.
- 2Kies een harmonie. Wissel tussen complementair, split-complementair, analoog, triadisch, tetradisch, monochroom, schaduwen en tinten. Het palet wordt direct herberekend.
- 3Kopieer de kleuren. Klik op een kleurvlak om die hexcode te kopieren, of gebruik de kopieerknop om het hele palet als CSS-variabelen over te nemen.
Voor wie
- Webdesigners die een site starten vanuit een enkele merkkleur: genereer analoge of split-complementaire kleuren voor achtergronden, knoppen en accenten.
- Front-end developers die een startpunt voor design tokens nodig hebben: kopieer het palet als CSS-variabelen en zet het direct in een stylesheet.
- Marketeers en presentatiemakers die grafieken, social media beelden of slides willen laten aansluiten bij een logokleur, zonder ontwerptool.
- Illustratoren en hobbyisten die tinten en schaduwen van een kleur verkennen om diepte, hooglichten en schaduwen in een werk op te bouwen.
Veelgestelde vragen
Is deze kleurenpalet generator gratis?
Ja - 100% gratis, zonder account, zonder watermerk en zonder limieten. Genereer en kopieer zoveel paletten als je wilt, voor persoonlijke of commerciele projecten.
Worden mijn kleurgegevens ergens geupload?
Nee. Het palet wordt volledig in je browser berekend met gewone JavaScript. Je merkkleuren, invoer en klikken worden nooit naar een server verstuurd.
Wat is een complementaire kleur?
De complementaire kleur staat recht tegenover je basiskleur op de kleurencirkel - een draai van 180 graden. Complementaire paren zoals blauw en oranje geven het sterkste contrast, waardoor ze populair zijn voor call-to-action knoppen tegen een merkachtergrond.
Wat is het verschil tussen een analoog en een triadisch palet?
Analoge paletten gebruiken naburige tinten (binnen ongeveer 30 graden van de basiskleur), waardoor ze rustig en samenhangend aanvoelen. Triadische paletten nemen drie tinten die 120 graden uit elkaar liggen, wat een levendig, evenwichtig schema geeft met meer contrast tussen de kleuren.
Wat zijn schaduwen en tinten?
Schaduwen maken je basiskleur donkerder door de helderheid richting zwart te verschuiven; tinten maken hem lichter richting wit. Beide behouden dezelfde tint en verzadiging, waardoor ze ideaal zijn voor hover-states, randen en achtergrondlagen van een merkkleur.
Hoeveel kleuren moet een websitepalet hebben?
Een veelgebruikte vuistregel is 60-30-10: een dominante kleur voor ongeveer 60% van de interface, een secundaire kleur voor 30% en een accentkleur voor 10%. Begin hier met een harmonie van 3 tot 5 kleuren en voeg daarna schaduwen en tinten toe voor states en oppervlakken.
Waarom verandert het palet nauwelijks bij grijs of zwart?
Grijs, zwart en wit hebben geen verzadiging, dus is er geen tint waarop de harmonie-rotaties kunnen inwerken - niets draaien levert dezelfde neutrale kleur op. Bouw in plaats daarvan een neutrale schaal met de helderheidsmodi: tinten voor zwart of donkergrijs, schaduwen voor wit of lichtgrijs, en monochroom voor middengrijs.