Générateur d’outils pratiques

Générateur de palette de couleurs

Créez une palette harmonieuse et accessible depuis une couleur, une photo ou une idée aléatoire.

HEX · RGB · HSL · OKLCH · WCAG

Studio de palettes de couleurs

Créez une palette harmonieuse et accessible depuis une couleur, une photo ou une idée aléatoire.

5
🖼️ Extraire les couleurs d’une imageL’image est traitée uniquement dans votre navigateur et n’est pas envoyée.
Astuce : appuyez sur Espace pour régénérer.

Votre palette

Cliquez sur un code pour le copier. Verrouillez ou réorganisez les couleurs avant de régénérer.

Faites glisser les cartes ou utilisez les flèches pour les réorganiser.

Aperçu d’interface

Votre palette
Rôle: Accent

Un système visuel plus clair

Testez la palette sur une carte réaliste avec navigation, texte et bouton.

Voir les détails

Accessibilité et contraste

–

Tableau des contrastes

Aperçu de la vision des couleurs

Aperçu approximatif : testez avec de vraies personnes et ne vous fiez jamais à la couleur seule.

Créateur de dégradés

Exporter la palette

Choisir une harmonie colorée

Une palette monochrome décline une teinte. Les couleurs analogues sont proches ; les modes complémentaire, triadique et tétradique élargissent les écarts.

Vérifier l’accessibilité

Les résultats WCAG comportent aussi des libellés. Le texte normal exige 4,5:1 pour AA et le grand texte 3:1.

Choisir le bon format

HEX et RGB sont très compatibles, HSL facilite les réglages et OKLCH offre une luminosité et une chroma perceptuellement plus régulières.

FAQ du générateur de palettes

Qu’est-ce qu’une harmonie colorée ?

C’est une relation reproductible entre les teintes, par exemple analogue, complémentaire ou triadique.

Comment rendre une palette accessible ?

Vérifiez le contraste texte-fond, ne reposez pas tout sur la couleur et testez aussi les états interactifs.

Mon image est-elle envoyée au serveur ?

Non. L’extraction se fait localement dans le navigateur et l’image n’est pas téléversée.

Quel format d’export choisir ?

CSS pour les sites, SCSS pour les feuilles de style, JSON pour les applications et PNG comme référence visuelle.