# Générateurs de palettes de couleurs : des palettes qui marchent

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

Les générateurs excellent à produire cinq jolies pastilles et peinent à vous dire quoi en faire. L’essentiel se passe après le clic.

## The short version

- Un générateur de palette de couleurs produit un ensemble de couleurs à partir d’une règle, du hasard, d’une photo ou d’une consigne écrite, mais il ne décide pas quel rôle tient chaque couleur.
- La plupart des palettes générées donnent à chaque couleur le même poids et une saturation semblable, ce qui passe en pastilles et crie dans une vraie création.
- Une palette utilisable a besoin d’un fond clair ou sombre, d’une encre pour le texte, d’une ou deux couleurs principales et d’un petit accent.
- Vérifiez que la palette couvre une large plage de clarté, car des couleurs de clarté proche se confondent et échouent aux tests de contraste.
- Testez toujours une palette générée sur une vraie mise en page avec de vrais mots avant de l’adopter.

Un **générateur de palette de couleurs** est un outil qui propose un ensemble de couleurs harmonieuses, à partir des règles de la théorie des couleurs, du hasard, d’une photo ou d’une consigne écrite. Servez-vous-en pour vous débloquer, puis retouchez le résultat : ajoutez un fond neutre et une couleur de texte, donnez un rôle à chaque couleur et testez-la sur une vraie création. Les cinq pastilles du générateur sont un point de départ. La palette qui fonctionne est celle que vous en tirez.

## Les principaux types de générateurs de palettes

Chaque générateur fait, en coulisses, l’une de quatre choses. Savoir lequel vous utilisez vous dit à quoi il est bon et ce qu’il faudra corriger.

| Type | Fonctionnement | Utile pour | Point de vigilance |
| --- | --- | --- | --- |
| Cercle d’harmonies | Choisit des couleurs à angles fixes depuis une teinte de base : complémentaire, analogue, triadique | Apprendre, et construire autour d’une couleur que vous avez déjà | Cinq couleurs à la même saturation, ce qui fait artificiel |
| Aléatoire avec verrous | Mélange les couleurs ; vous verrouillez celles qui vous plaisent et relancez | La découverte, et sortir de ses habitudes | Des associations plaisantes sans structure derrière |
| À partir d’une image | Prélève les couleurs dominantes d’une photo | S’accorder à un produit, un lieu ou une photo de campagne | Des tons moyens boueux, et des couleurs inutilisables pour le texte |
| À partir d’une consigne | Un modèle d’IA propose des couleurs pour des mots comme «  boulangerie paisible  » | Des idées rapides pour une ambiance ou un brief de marque | Des clichés à la mode, et des codes dont personne n’a vérifié le contraste |

Adobe Color est un cercle d’harmonies bien connu ; Coolors, un générateur aléatoire avec verrous bien connu. La plupart des outils combinent plusieurs approches.

Pour comprendre les règles derrière les cercles d’harmonies, lisez [l’harmonie des couleurs](https://gradiently.design/fr/guide/color-harmony). Pour l’approche par la photo, [une palette de couleurs à partir d’une image](https://gradiently.design/fr/guide/color-palette-from-image) explique comment mieux prélever, et [les générateurs de palettes par IA](https://gradiently.design/fr/guide/ai-color-palette-generator) traitent de l’art de la consigne.

## Pourquoi les palettes générées échouent souvent en situation réelle

Un générateur présente les couleurs en cinq bandes égales. Les vraies créations n’ont rien à voir : une couleur couvre l’essentiel de l’espace, une autre porte les mots et le reste n’apparaît qu’en petites quantités. Voici un résultat aléatoire typique, à côté de la même idée une fois retouchée.

- Rouge: #e63946
- Jaune: #f1c40f
- Vert: #2ecc71
- Bleu: #3498db
- Violet: #9b59b6

Tel que généré : cinq teintes saturées d’intensité semblable. Rien sur quoi lire du texte, rien de calme, et rien qui mène.

- Fond #f7f3ec: #f7f3ec
- Encre #1c2321: #1c2321
- Canard principal #2a6f68: #2a6f68
- Sauge d’appui #a8c5b8: #a8c5b8
- Accent corail #e07a5f: #e07a5f

Après retouche : un fond blanc cassé chaud, une encre presque noire (14,5:1 sur le fond), un bleu canard qui porte la couleur du fond en texte à 5,3:1, un appui discret et un seul accent.

## Cinq retouches pour rendre utilisable n’importe quelle palette générée

1. **Gardez la couleur qui vous plaît vraiment** Verrouillez-la et faites-en la couleur principale. Tout le reste existe pour la servir. Si rien ne se détache, relancez plutôt que de vous contenter du résultat.
2. **Ajoutez un fond et une encre** Les générateurs les incluent rarement. Choisissez un fond clair (un blanc cassé chaud ou froid) ou sombre, et une couleur d’encre pour le texte qui contraste fortement avec lui. Teintez légèrement les deux vers votre couleur principale pour qu’ils s’accordent.
3. **Étagez la clarté** Passez les pastilles en niveaux de gris, de tête ou à l’écran. Vous voulez des valeurs claires, moyennes et sombres, pas cinq valeurs moyennes. Ajustez la clarté jusqu’à ce que chaque couleur se distingue nettement.
4. **Baissez la saturation de toutes sauf une** Laissez l’accent vif et calmez les autres. Une couleur d’appui plus douce que la couleur principale rend celle-ci plus riche.
5. **Attribuez les proportions** Une bonne répartition de départ est la [règle 60 30 10](https://gradiently.design/fr/guide/60-30-10-rule) : le fond à environ 60 %, la couleur principale à environ 30 %, l’accent à environ 10 %. Ajustez à l’œil une fois la mise en page sous les yeux.

Pour faire ces retouches avec précision, travaillez dans un format qui sépare la clarté de la teinte. [HSL](https://gradiently.design/fr/guide/hsl-colors) est facile à lire ; [OKLCH](https://gradiently.design/fr/guide/oklch-explained) garde mieux une clarté juste d’une teinte à l’autre.

## Testez la palette sur une vraie mise en page

Les pastilles cachent des problèmes qui surgissent dès que les mots arrivent. Posez votre palette sur quelque chose que vous feriez vraiment, comme une publication, un menu ou une section d’accueil, et regardez-la à la taille où on la verra. Vérifiez ensuite chaque association de texte avec un [vérificateur de contraste](https://gradiently.design/fr/guide/color-contrast-accessibility).

Une publication Instagram au format portrait annonçant une nouvelle carte, dans une famille de couleurs calme avec un texte net et lisible

Une palette fait ses preuves dans un vrai format avec de vrais mots. Si le titre peine ici, changez la palette, pas le titre.

Un dégradé fait un test supplémentaire rapide. Fondez ensemble le fond, la couleur principale et la couleur d’appui : si le mélange devient gris au milieu, deux couleurs s’affrontent, comme l’explique [les dégradés boueux](https://gradiently.design/fr/guide/muddy-gradients).

La palette retouchée en dégradé: `linear-gradient(160deg, #f7f3ec 0%, #a8c5b8 45%, #2a6f68 85%, #1c2321 100%)`

Du fond à la sauge, au bleu canard puis à l’encre, sans zone grise en chemin. Le corail reste à l’écart, réservé aux petits accents.

## Enregistrez-la en tokens, pas en capture d’écran

Une fois la palette au point, nommez les couleurs par leur rôle plutôt que par leur teinte, pour pouvoir changer le bleu canard plus tard sans tout renommer. En code, ce sont des variables CSS ; dans les outils de design, des styles nommés ; dans Gradiently, le kit de marque, où palettes, polices et ton de voix vivent ensemble et où le Designer les applique à tout ce qu’il crée.

```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);
}
```

Les noms de rôle survivent à un changement d’identité. Une variable appelée --teal, non.

## Chercher par couleur plutôt que générer

Parfois, ce que vous voulez vraiment, ce n’est pas cinq codes mais un fond abouti dans une famille de couleurs. Le Marché de Gradiently permet de chercher des Marks par mots de couleur comme «  bleu canard profond  » ou «  pêche chaude  » et de filtrer par style. Chaque Mark est un fond vivant de dégradé et de matière, avec sa propre palette et sa propre voix typographique, comparé à tous les autres pour qu’aucun ne se ressemble, et vous pouvez créer gratuitement avec n’importe quel Mark non réservé. C’est un autre chemin vers le même but : des couleurs qui vont ensemble et tiennent déjà leur rôle.

## FAQ

### Quel est le meilleur générateur de palette de couleurs ?

Tout dépend de votre façon de travailler : les cercles d’harmonies conviennent pour construire autour d’une couleur, les générateurs aléatoires avec verrous pour la découverte, et les échantillonneurs d’image pour s’accorder à une photo. Tous demandent des retouches ensuite.

### Combien de couleurs doit compter une palette ?

La plupart des marques s’en sortent très bien avec un fond, une encre, une ou deux couleurs principales et un accent, soit quatre ou cinq en tout. Au-delà, la cohérence devient difficile à tenir.

### Pourquoi ma palette générée rend-elle mal dans ma création ?

En général, les couleurs ont une clarté et une saturation proches et aucun rôle clair. Ajoutez un fond neutre et une couleur de texte, étagez la clarté et ne gardez qu’un seul accent vif.

### Comment vérifier l’accessibilité d’une palette ?

Testez chaque association de texte et de fond avec un vérificateur de contraste, en visant au moins 4,5:1 pour le texte courant, et regardez la palette en niveaux de gris pour vous assurer que les couleurs restent distinctes.
