🎨 Générateur de Palette — Construire des Palettes 5 Couleurs

Generate harmonious 5-color schemes from any base color. Complementary, analogous, triadic, tetradic, monochromatic. Export as CSS variables or Tailwind.

Enter a base color and instantly see five harmonious colors generated using classic color theory rules: complementary (opposite), analogous (adjacent), triadic (three equidistant), tetradic (four), or monochromatic. Export as CSS custom properties, a Tailwind config, or JSON.


How to Use

1

Pick a base color

Click the base color swatch or enter a HEX value to set your starting color.

2

Choose a scheme

Select Complementary, Analogous, Triadic, Tetradic, or Monochromatic from the scheme selector.

3

Export the palette

Lock colors you want to keep, click Regenerate to vary others, then export as CSS variables, Tailwind, or JSON.

Frequently Asked Questions

What is a color palette in design? +
A color palette is a set of colors chosen to work harmoniously together in a design. Color theory defines relationships between colors: complementary (opposite on the color wheel), analogous (adjacent), triadic (three equidistant), tetradic (four), and monochromatic (same hue, varying lightness).
What is a complementary color scheme? +
Complementary colors are directly opposite each other on the color wheel (e.g., blue and orange, red and green). They create strong contrast and visual tension — ideal for call-to-action buttons and highlights that need to stand out.
What is an analogous color scheme? +
Analogous colors are adjacent on the color wheel (e.g., blue, blue-green, green). They create harmonious, natural-looking combinations with low contrast — great for backgrounds, serene designs, and nature-inspired UIs.
How do I lock a color I like? +
Click the lock icon on any color swatch to lock it. Locked colors are preserved when you click Regenerate or change the scheme type. This lets you keep a brand color while varying the supporting palette.
How do I export the palette? +
Use the Export dropdown to copy as CSS custom properties (--color-1: #abc), Tailwind config colors object, or a raw JSON array. All formats are ready to paste directly into your project.


Guide : Générateur de Palette de Couleurs

Qu'est-ce que c'est ?

Le Générateur de Palette crée des combinaisons de couleurs harmonieuses : complémentaires, triadiques, analogues et monochromatiques, basées sur une couleur de base.

Idéal pour créer des identités visuelles cohérentes et des systèmes de design accessibles.

Comment utiliser

  1. Sélectionnez une couleur de base avec le sélecteur de couleur.
  2. Choisissez le type d'harmonie (complémentaire, triadique…).
  3. Parcourez la palette générée avec les codes HEX/RGB.
  4. Exportez la palette en CSS custom properties ou JSON.

Conseils professionnels

🧰 50+ Tools