Générateur de Palettes de Couleurs

Générez des palettes de couleurs harmonieuses à partir d'une couleur de base — complémentaire, analogue, triadique et complémentaire scindée. Un outil essentiel pour les designers et les développeurs front-end.

Studio · environnement neutre

Couleur de base

Harmonie

Couleurs

Fonctionnalités

Couleurs complémentaires

Couleurs analogues

Schéma triadique

Complémentaire divisé

Exporter en variables CSS

Comment Utiliser

1. Choisissez une couleur de base et un schéma d'harmonie — la surface se remplit d'une palette.

2. Appuyez sur Espace (ou Mélanger) pour varier. Survolez une colonne pour copier, modifier, ouvrir son échelle de nuances ou la verrouiller.

3. Changez la surface (blanc / gris / sombre / damier) pour éprouver la palette sur différents fonds, puis exportez en CSS, Tailwind, JSON, SVG ou PNG.

À propos de cet outil

Les bonnes palettes sont rarement dues au hasard : la plupart suivent des relations sur le cercle chromatique. À partir d'une couleur de base, ce générateur crée des palettes de six couleurs selon les harmonies classiques — analogue (teintes voisines pour des designs calmes), monochrome (une teinte à différentes luminosités), complémentaire (teintes opposées pour un fort contraste), complémentaire adjacente, triadique et tétradique. Chaque colonne affiche sa valeur et un nom de couleur approximatif ; vous pouvez la copier, la modifier, ouvrir une échelle de nuances plus claires et plus foncées, ou la verrouiller pour qu'elle reste en place pendant que vous mélangez le reste. Prévisualisez la palette sur fond blanc, gris, sombre ou transparent, puis exportez-la en variables CSS, en configuration de couleurs Tailwind, en JSON, en SVG ou en planche d'échantillons PNG.

Questions Fréquentes

Quelle est la différence entre les schémas d'harmonie ?

L'analogue utilise des teintes voisines, le monochrome garde une teinte et fait varier la luminosité, le complémentaire associe des teintes opposées, le complémentaire adjacent utilise les deux teintes voisines de la complémentaire, le triadique espace trois teintes de 120° et le tétradique utilise quatre teintes espacées de 90°.

Quel schéma convient le mieux à un site web ?

Les palettes analogues ou monochromes sont les plus faciles à utiliser pour une interface, car elles paraissent calmes. Les schémas complémentaires et triadiques offrent des accents forts : une approche courante consiste à prendre une couleur dominante, une couleur d'appui et une petite touche de la complémentaire pour les appels à l'action.

Comment fonctionnent les couleurs verrouillées ?

Verrouiller une colonne conserve exactement cette couleur quand vous appuyez sur Espace ou Mélanger pour générer des variantes. C'est utile quand une couleur de marque est imposée et que vous cherchez ce qui s'accorde avec elle.

Les palettes générées sont-elles accessibles ?

L'harmonie ne garantit pas un contraste lisible. Avant d'utiliser deux couleurs de la palette pour un texte et son fond, vérifiez la paire avec un vérificateur de contraste selon le niveau WCAG AA (4,5:1 pour le texte courant).

Dans quels formats puis-je exporter ?

Propriétés personnalisées CSS, un extrait theme.extend.colors pour Tailwind, un tableau JSON de valeurs HEX, un fichier SVG avec les échantillons et un PNG de 1500 × 900 avec les valeurs imprimées sur chaque colonne.