Kleurengenerator

Krijg een willekeurige kleur of een heel palet, met de codes klaar om te kopiëren.

Wat is een kleurengenerator?

Een kleurengenerator maakt willekeurige kleuren en toont de bijbehorende codes, zodat je ze meteen kunt gebruiken. Hij is een snelle bron van inspiratie als je een website, logo, presentatie, kamer of kunstwerk ontwerpt en niet weet waar je moet beginnen. Genereer één kleur of een heel palet, kopieer de kleuren die je mooi vindt en genereer daarna opnieuw.

Zo gebruik je hem

  1. Kleuren: kies één kleur, een palet van 5 kleuren of 10 kleuren.
  2. Stijl: kies wat voor kleuren je wilt (zie hieronder).
  3. Klik op Genereren. Elk kleurvlak toont zijn HEX-, RGB- en HSL-codes.
  4. Klik op Kopiëren onder een kleurvlak om de HEX-code te kopiëren, klaar om in CSS, Figma, Canva, PowerPoint of een andere ontwerpapp te plakken.

Volledig scherm: klik bovenaan de tool op Volledig scherm om het palet groot te tonen, bijvoorbeeld als je kleurideeën aan een klant of klas presenteert. Druk op Esc om terug te keren. Bij 🎨 Kleuren en effecten kun je eigen kleuren voor de achtergrond en knoppen kiezen.

De vier stijlen

  • Mooi: willekeurige tint met middelmatige tot sterke verzadiging en gemiddelde helderheid. Deze kleuren zien er meestal goed uit en passen bij elkaar. De beste plek om te beginnen.
  • Pastel: zachte, lichte kleuren, goed voor achtergronden, baby- en trouwontwerpen en rustige interfaces.
  • Donker: diepe, gedempte tinten, handig voor achtergronden in donkere modus, kopteksten en sfeervolle ontwerpen.
  • Elke kleur: kiest met gelijke kans uit alle 16.777.216 RGB-kleuren. Omdat de keuze volledig willekeurig is, krijg je vaak bruine, grijze of doffe tinten, maar soms ook een echte parel.

HEX, RGB en HSL uitgelegd

  • HEX (bijvoorbeeld #4F46E5) is de meest gebruikte manier om een kleur op het web te schrijven. De drie tekenparen zijn de hoeveelheden rood, groen en blauw, elk van 00 tot FF.
  • RGB (bijvoorbeeld rgb(79, 70, 229)) geeft dezelfde hoeveelheden rood, groen en blauw als getallen van 0 tot 255.
  • HSL (bijvoorbeeld hsl(243, 75%, 59%)) beschrijft een kleur aan de hand van drie kenmerken: tint (de positie op de kleurencirkel, 0–360°), verzadiging (hoe intens de kleur is) en helderheid (hoe licht of donker de kleur is). Dit is het handigste formaat om een kleur handmatig aan te passen, bijvoorbeeld om een lichtere variant te maken voor een hover-effect.

Wanneer gebruik je willekeurige kleuren?

  • Web- en appontwerp: Vind een accentkleur of een startpalet en verfijn het daarna.
  • Kunst en illustratie: Daag jezelf uit om alleen met het gegenereerde palet te schilderen of te tekenen.
  • Huisstijl en presentaties: Verken snel kleurrichtingen voordat je de kleuren van je merk vastlegt.
  • Spelletjes en de klas: Wijs willekeurig teamkleuren toe of speel “hoe heet deze kleur?”.
  • Interieur en hobby: Doe ideeën op voor breiwerk, quilts of kleurcombinaties in een kamer.

Tips voor het gebruik van een palet

  • Veel ontwerpers gebruiken de 60-30-10-regel: één hoofdkleur voor ongeveer 60% van het ontwerp, een tweede kleur voor 30% en een accentkleur voor de laatste 10%.
  • Controleer altijd het contrast van tekst. Donkere tekst op pasteltinten en witte tekst op donkere kleuren is meestal goed leesbaar.
  • Kopieer de kleuren die je mooi vindt voordat je opnieuw op “Genereren” klikt, want een nieuw palet vervangt ze allemaal.

Liever een willekeurige letter of een willekeurig getal? Probeer de lettergenerator of de getallengenerator.

Veelgestelde vragen

Welke kleurformaten krijg ik?

Elke kleur wordt getoond als HEX-code (bijvoorbeeld #4F46E5), RGB-waarde en HSL-waarde, klaar om te kopiëren naar CSS, Figma of elk ander ontwerpprogramma.

Wat is het verschil tussen “Mooi” en “Elke kleur”?

“Elke kleur” kiest elk van de 16,7 miljoen RGB-kleuren met dezelfde kans, wat vaak modderige tinten geeft. “Mooi” houdt verzadiging en helderheid binnen een bereik dat meestal goed samengaat.

Kan ik een kleur bewaren die ik mooi vind?

Klik op de Kopiëren-knop van de kleur om de HEX-code te kopiëren. Een nieuw palet vervangt alle kleuren, dus kopieer de kleuren die je wilt houden eerst.

Kan ik het palet op volledig scherm tonen?

Ja. Klik bovenaan de tool op “Volledig scherm”, dan vullen de kleurvlakken het scherm, handig om ideeën te presenteren. Druk op Esc of “Volledig scherm sluiten” om terug te keren.