Générateur de palette

Générez des palettes harmonieuses depuis une couleur de base. Choisissez une harmonie, ajustez le nombre de couleurs et exportez en CSS, SCSS, Tailwind ou JSON.

Couleur de base
Teinte unique, variations de luminosité et de saturation. Cohérent et minimaliste - idéal pour les designs sobres et élégants.
Deux teintes opposées sur le cercle chromatique (180°). Contraste élevé et vibrant - à doser pour éviter les tensions visuelles.
Trois teintes adjacentes (±30°). Naturellement harmonieux et apaisant - parfait pour les fonds et illustrations.
Trois teintes équidistantes (120°). Équilibré et coloré - fonctionne bien avec une couleur dominante et deux couleurs d'accent.
Une teinte plus les deux couleurs encadrant son complément (±30°). Contraste plus doux que le complémentaire, plus dynamique que l'analogue.
Quatre teintes formant deux paires complémentaires (90°). Riche et complexe - nécessite un équilibre soigné pour éviter les dissonances.
#08345E
#8AC1F5
#080A5E
Base
#6366F1
#32085E
:root {
  --color-1: #08345e;
  --color-2: #8ac1f5;
  --color-3: #080a5e;
  --color-4: #6366f1;
  --color-5: #32085e;
}

À propos : Générateur de palette

Le générateur de palette crée des couleurs harmonieuses à partir d'une couleur de base, selon six harmonies du cercle chromatique : monochrome, complémentaire, analogue, triade, complémentaires adjacentes et tétrade. Tu peux verrouiller les couleurs qui te plaisent, les nommer, les annoter, les réordonner et gérer plusieurs palettes dans des onglets. L'export en CSS, SCSS, Tailwind ou JSON donne des variables prêtes à coller dans un projet, un design system ou un thème.

Fonctionnalités

  • Six harmonies, chacune avec un aperçu miniature avant de cliquer, et de 3 à 10 couleurs par palette.
  • Couleurs verrouillées : une couleur retouchée ou verrouillée ne bouge plus quand tu changes d'harmonie, de couleur de base ou cliques sur « Aléatoire ».
  • Nom et note pour chaque couleur, repris à l'export : le nom devient la variable, la note un commentaire.
  • Jusqu'à 20 palettes en onglets, à renommer, dupliquer ou supprimer, et couleurs réordonnées par appui long.
  • Liens de partage en lecture seule, en copie modifiable ou en édition partagée en temps réel avec d'autres personnes.

Comment l'utiliser

  1. Choisis une couleur de base, ou clique sur « Aléatoire » pour en tirer une.
  2. Sélectionne une harmonie en t'aidant des aperçus, puis règle le nombre de couleurs.
  3. Retouche ou verrouille les couleurs à garder, et donne-leur un nom et une note.
  4. Choisis le format d'export, HEX, CSS, SCSS, Tailwind ou JSON, et copie le code.

Questions relatives à l'utilisation

Elle associe deux teintes opposées sur le cercle chromatique, à 180° l'une de l'autre, comme le bleu et l'orange. Le contraste est fort : on garde souvent une teinte dominante et on réserve l'autre aux accents. L'outil décline chaque teinte en plusieurs niveaux de luminosité.

Choisis l'onglet Tailwind dans l'export : tu obtiens un objet de couleurs à coller dans theme.extend.colors de ta configuration Tailwind. Les noms donnés aux couleurs deviennent les clefs, sinon color-1, color-2, etc., et les notes apparaissent en commentaire.

Oui. Crée un lien en édition partagée : chaque personne qui l'ouvre modifie les mêmes palettes en temps réel. Le contenu est chiffré dans ton navigateur avant l'envoi, le serveur ne peut pas le lire. Tu peux aussi partager en lecture seule ou en copie modifiable.