# Kleurenpalet-generators: zo krijg je paletten die echt werken

[Canonical HTML page](https://gradiently.design/nl/guide/color-palette-generator)

Generators zijn briljant in vijf mooie kleurvlakken maken en slecht in vertellen wat je ermee moet doen. Het nuttige deel begint na de klik op de knop.

## The short version

- Een kleurenpalet generator maakt een set kleuren uit een regel, een willekeurige zaadwaarde, een foto of een tekstprompt, maar bepaalt niet welke kleur welke taak heeft.
- De meeste gegenereerde paletten geven elke kleur gelijk gewicht en vergelijkbare verzadiging, wat als kleurvlakken prima oogt en in een echt ontwerp schreeuwerig is.
- Een bruikbaar palet heeft een lichte of donkere ondergrond, een inktkleur voor tekst, één of twee hoofdkleuren en een klein accent.
- Controleer of het palet een breed bereik aan helderheid beslaat, want kleuren van gelijke helderheid vloeien in elkaar over en falen bij contrastcontroles.
- Test een gegenereerd palet altijd op een echte opmaak met echte woorden voordat je je eraan bindt.

Een **kleurenpalet generator** is een tool die een set kleuren voorstelt die goed bij elkaar staan, op basis van kleurtheorie, toeval, een foto of een geschreven prompt. Gebruik er een om op gang te komen en pas het resultaat daarna aan: voeg een neutrale ondergrond en een tekstkleur toe, geef elke kleur een taak en test het op een echt ontwerp. De vijf kleurvlakken van de generator zijn een startpunt. Het palet dat werkt, is het palet dat je er zelf van maakt.

## De belangrijkste soorten palet-generators

Elke generator doet onder de motorkap een van vier dingen. Als je weet welke soort je gebruikt, weet je waar hij goed in is en wat je zelf moet herstellen.

| Soort | Hoe het werkt | Goed voor | Let op |
| --- | --- | --- | --- |
| Harmoniewiel | Kiest kleuren op vaste hoeken vanaf één basistint: complementair, analoog, triadisch | Leren en bouwen rond een kleur die je al hebt | Vijf kleuren met dezelfde verzadiging, wat synthetisch oogt |
| Willekeurig met vergrendeling | Schudt kleuren, jij vergrendelt wat je bevalt en schudt opnieuw | Ontdekken en een gewoonte doorbreken | Prettige combinaties zonder structuur erachter |
| Uit een afbeelding | Neemt de dominante kleuren van een foto over | Aansluiten op een product, een plek of een campagnefoto | Modderige middentonen en kleuren die je niet voor tekst kunt gebruiken |
| Uit een prompt | Een AI-model stelt kleuren voor bij woorden als rustige bakkerij | Snelle ideeën voor een sfeer of merkbrief | Populaire clichés en codes waarvan niemand het contrast heeft gecontroleerd |

Adobe Color is een bekend harmoniewiel, Coolors een bekende willekeurige generator met vergrendeling. De meeste tools mengen meerdere werkwijzen.

Wil je de regels achter harmoniewielen begrijpen, lees dan [kleurharmonie](https://gradiently.design/nl/guide/color-harmony). Voor de fotomethode legt [kleurenpalet uit een afbeelding](https://gradiently.design/nl/guide/color-palette-from-image) uit hoe je betere samples kiest, en [AI-kleurenpalet-generators](https://gradiently.design/nl/guide/ai-color-palette-generator) gaat over prompten.

## Waarom gegenereerde paletten in echte ontwerpen vaak falen

Een generator toont kleuren als vijf gelijke stroken. Echte ontwerpen zijn daar het tegendeel van: één kleur beslaat het grootste deel van de ruimte, één draagt de woorden en de rest komt in kleine hoeveelheden voor. Hier een typisch willekeurig resultaat naast hetzelfde idee na bewerking.

- Rood: #e63946
- Geel: #f1c40f
- Groen: #2ecc71
- Blauw: #3498db
- Paars: #9b59b6

Zoals gegenereerd: vijf verzadigde tinten van gelijke sterkte. Niets om tekst op te zetten, niets rustigs en niets dat de leiding neemt.

- Ondergrond #f7f3ec: #f7f3ec
- Inkt #1c2321: #1c2321
- Hoofdteal #2a6f68: #2a6f68
- Steunsalie #a8c5b8: #a8c5b8
- Koraalaccent #e07a5f: #e07a5f

Na bewerking: een warme gebroken witte ondergrond, een bijna zwarte inkt (14,5:1 op de ondergrond), een teal die de ondergrondkleur als tekst draagt met 5,3:1, een stille steunkleur en één accent.

## Vijf aanpassingen die elk gegenereerd palet bruikbaar maken

1. **Houd de ene kleur die je echt mooi vindt** Vergrendel hem en behandel hem als hoofdkleur. Al het andere bestaat om hem te ondersteunen. Valt niets op, genereer dan opnieuw in plaats van genoegen te nemen.
2. **Voeg een ondergrond en een inkt toe** Generators nemen ze zelden mee. Kies een lichte ondergrond (een warm of koel gebroken wit) of een donkere, en een inktkleur voor tekst die er sterk mee contrasteert. Geef beide een lichte tint richting je hoofdkleur zodat ze erbij horen.
3. **Spreid de helderheid** Zet de kleurvlakken in gedachten of op het scherm om naar grijswaarden. Je wilt lichte, middelste en donkere waarden, geen vijf middens. Pas de helderheid aan tot elke kleur duidelijk apart staat.
4. **Verlaag de verzadiging van alles op één na** Laat het accent levendig en temper de rest. Een steunkleur die zachter is dan de hoofdkleur laat de hoofdkleur rijker ogen.
5. **Wijs verhoudingen toe** Een goede eerste verdeling is de [60-30-10-regel](https://gradiently.design/nl/guide/60-30-10-rule): ondergrond ongeveer 60%, hoofdkleur ongeveer 30%, accent ongeveer 10%. Stel op het oog bij zodra je het in een opmaak ziet.

Om deze aanpassingen precies te doen, werk je in een kleurnotatie die helderheid van tint scheidt. [HSL](https://gradiently.design/nl/guide/hsl-colors) is makkelijk te lezen. [OKLCH](https://gradiently.design/nl/guide/oklch-explained) houdt de helderheid beter eerlijk over verschillende tinten.

## Test het palet op een echte opmaak

Kleurvlakken verbergen problemen die verschijnen zodra er woorden komen. Zet je palet op iets wat je echt zou maken, zoals een post, een menukaart of een herosectie, en bekijk het op de grootte waarop mensen het zien. Controleer daarna elke tekstcombinatie met een [contrastcontrole](https://gradiently.design/nl/guide/color-contrast-accessibility).

Een staande Instagram-post die een nieuw menu aankondigt, in een rustige kleurfamilie met duidelijke, leesbare letters

Een palet verdient zijn plek in een echt formaat met echte woorden. Als de kop hier moeite heeft, pas dan het palet aan, niet de kop.

Een verloop is een snelle extra test. Meng de ondergrond-, hoofd- en steunkleur: wordt de menging in het midden grijs, dan vechten twee van de kleuren met elkaar, wat wordt uitgelegd in [modderige verlopen](https://gradiently.design/nl/guide/muddy-gradients).

Het bewerkte palet als verloop: `linear-gradient(160deg, #f7f3ec 0%, #a8c5b8 45%, #2a6f68 85%, #1c2321 100%)`

Ondergrond naar salie naar teal naar inkt, zonder grijze plek onderweg. Het koraal blijft erbuiten, bewaard voor kleine accenten.

## Bewaar het als tokens, niet als screenshot

Zodra het palet werkt, benoem je kleuren naar hun taak in plaats van hun tint, zodat je de teal later kunt wijzigen zonder alles te hernoemen. In code betekent dat CSS-variabelen, in ontwerptools benoemde stijlen, en in Gradiently de merkkit, waar paletten, lettertypen en stem samenwonen en de Designer ze toepast op wat hij maakt.

```css
:root {
  --color-ground:  #f7f3ec;
  --color-ink:     #1c2321;
  --color-main:    #2a6f68;
  --color-support: #a8c5b8;
  --color-accent:  #e07a5f;
}

.button {
  background: var(--color-main);
  color: var(--color-ground);
}
```

Rolnamen overleven een rebrand. Een variabele die --teal heet niet.

## Zoeken op kleur in plaats van genereren

Soms wil je eigenlijk geen vijf codes maar een afgewerkte achtergrond in een kleurfamilie. In de Markt van Gradiently zoek je Marks met kleurwoorden als “diep teal” of “warme perzik” en filter je op look. Elke Mark is een levende achtergrond van verloop en materiaal met een eigen palet en lettertypestem, gecontroleerd tegen alle andere zodat er geen twee op elkaar lijken, en je kunt gratis ontwerpen met elke vrije Mark. Het is een andere route naar hetzelfde doel: kleuren die bij elkaar horen en hun taak al vervullen.

## FAQ

### Wat is de beste kleurenpalet generator?

Dat hangt af van hoe je werkt: harmoniewielen passen bij bouwen rond één kleur, willekeurige generators met vergrendeling bij ontdekken en beeldsamplers bij aansluiten op een foto. Alle drie moet je daarna bewerken.

### Hoeveel kleuren moet een palet hebben?

De meeste merken werken goed met een ondergrond, een inkt, één of twee hoofdkleuren en één accent, dus vier of vijf in totaal. Meer is lastig consistent te houden.

### Waarom ziet mijn gegenereerde palet er slecht uit in mijn ontwerp?

Meestal hebben de kleuren vergelijkbare helderheid en verzadiging en geen duidelijke rollen. Voeg een neutrale ondergrond en een tekstkleur toe, spreid de helderheid en houd maar één levendig accent.

### Hoe controleer ik een palet op toegankelijkheid?

Test elke combinatie van tekst en achtergrond met een contrastcontrole, met minstens 4,5:1 voor lopende tekst, en bekijk het palet in grijswaarden om te zien of de kleuren onderscheidbaar zijn.
