Générer une Palette depuis une Couleur
Créez une palette complète à partir d'une couleur de base — nuances, complémentaires, analogues — et copiez chaque code HEX.
Cliquez sur un échantillon pour copier son HEX.
Généré en local
Sûr pour une identité non dévoilée
Sans compte
Connexion sécurisée
Comment ça marche
- 1
Choisissez une couleur de base
Collez un code HEX — en général la couleur de marque à laquelle vous êtes déjà engagé.
- 2
Choisissez la règle d’harmonie
Complémentaire pour le contraste, analogue pour le calme, triadique ou tétradique pour la variété, nuances pour une échelle monochrome.
- 3
Copiez la palette
Reportez les valeurs HEX directement dans votre feuille de style, votre éditeur de thème ou votre outil de conception.
Pourquoi cet outil
Cinq règles d’harmonie
Complémentaire, analogue, triadique, tétradique et nuances : chacune est une relation définie sur le cercle chromatique, pas une ambiance.
Une entrée, un ensemble complet
Donnez la couleur de marque que vous avez déjà ; le reste en découle, si bien que la palette est ancrée et non assemblée.
Valeurs HEX copiables
Chaque échantillon arrive avec son code, prêt pour une feuille de style ou un fichier de conception.
Voir la relation
Les couleurs générées s’affichent ensemble, seule façon de juger si une combinaison tient.
Rien n’est envoyé
L’arithmétique du cercle s’exécute dans votre navigateur — aucune valeur de couleur ne part ailleurs.
Gratuit et sans compte
Aucune inscription, aucune limite de palettes, aucun filigrane.
Ce qu’est réellement une règle d’harmonie
Les règles sont des positions sur un cercle de teintes, pas des avis esthétiques. Prenez l’angle de teinte de la couleur de base : la règle vous dit où se placent les autres — complémentaire à +180°, analogue à environ ±30°, triadique à +120° et +240°, tétradique en deux paires complémentaires. Voilà tout le mécanisme. Leur utilité ne tient pas à ce que ces combinaisons seraient objectivement belles : elle tient à ce qu’elles sont **prévisibles**. Une palette construite par règle échoue d’une manière que vous pouvez analyser, tandis qu’une palette assemblée en choisissant des échantillons qui plaisaient isolément échoue le plus souvent d’une manière que personne ne sait diagnostiquer, faute de relation à inspecter.
Choisir entre les règles
Chaque règle résout un problème différent. Les teintes analogues se touchent et partagent un air de famille : elles sont sûres et discrètes — parfaites pour un fond ou une illustration, faibles dès qu’il faut faire ressortir quelque chose. La complémentaire maximise la séparation, ce qu’exige précisément un accent : une couleur dominante et une teinte opposée employée avec parcimonie pour l’action que vous voulez voir cliquée. La triadique donne trois teintes distinctes qui restent en équilibre, mais seulement si l’une domine nettement et que les deux autres accompagnent. La tétradique en propose quatre et se révèle vraiment difficile ; la plupart des palettes tétradiques qui fonctionnent en pratique emploient deux des couleurs sur une fraction de la surface des deux autres.
Pourquoi une interface a plus besoin de nuances que de teintes
Les règles ci-dessus répondent à « quelles couleurs vont ensemble », mais un produit réel a besoin d’autre chose : de nombreux paliers d’une même couleur. Un fond de page, une surface de carte, une bordure d’un pixel, un libellé désactivé et le texte courant sont généralement la même teinte à des luminosités différentes, et la régularité de ces paliers pèse davantage sur le rendu final que le choix entre triadique et tétradique. C’est ce que produit le mode nuances — une teinte unique déclinée en luminosité, exactement la façon dont se construit une échelle de couleurs dans un système de design. La plupart des projets ont bien plus besoin d’une teinte d’accent et d’une bonne échelle neutre que de cinq teintes distinctes.
Une palette générée est un point de départ, pas un système de design
Ce que le cercle vous donne, ce sont des relations de teintes. Ce qu’il ne peut pas donner, ce sont des rôles. Une palette opérationnelle attribue à chaque couleur une fonction — ceci est la surface, ceci l’action principale, ceci l’action destructive, ceci la bordure — et ces attributions dépendent de votre interface, non de la géométrie. Le cercle ignore par ailleurs tout de la lisibilité : un schéma triadique peut être parfaitement équilibré et poser malgré tout du texte sur un fond à 2,5:1. Générez ici les relations, attribuez vous-même les rôles, puis passez chaque couple texte / fond par le vérificateur de contraste avant que quoi que ce soit n’entre dans une bibliothèque de composants.
La proportion 60-30-10
Un échec courant consiste à voir dans une palette de cinq couleurs l’autorisation d’employer cinq couleurs à parts égales, ce qui donne une interface chargée et sans point focal. La convention qui survit au contact des maquettes réelles tourne autour de 60 % d’un neutre dominant, 30 % d’un secondaire et 10 % d’accent. Sous ce rapport, une paire complémentaire n’est pas deux couleurs en concurrence : c’est une grande surface calme et une petite interruption délibérée. C’est aussi pourquoi les palettes paraissent meilleures en maquette qu’en production : la maquette montre les échantillons à taille égale, l’interface ne le fera pas.
Convertir et étendre une palette
Une fois l’ensemble obtenu, le travail concret consiste à en faire quelque chose qu’une feuille de style puisse utiliser. Les valeurs de teinte issues du cercle arrivent en HEX ; si vous comptez dériver des variantes survol, actif et désactivé, convertissez-les d’abord en HSL avec le convertisseur de couleur et faites varier la luminosité par paliers, car cela maintient chaque variante dans la même famille de teinte au lieu de la laisser dériver. Gardez les couleurs de base comme source unique de vérité et générez les variantes à partir d’elles plutôt que de stocker des dizaines de codes hexadécimaux quasi identiques : une palette qui grandit à la main devient incohérente en quelques mois.
Erreurs courantes à éviter
- Employer toutes les couleurs de la palette au même poids. Cinq couleurs à surface égale donnent une interface sans point focal ; tenez-vous à environ 60 % de dominante, 30 % de secondaire et 10 % d’accent pour que l’accent en soit vraiment un.
- Choisir le schéma avant de savoir ce qui doit ressortir. L’analogue est calme et faible pour l’emphase ; la complémentaire existe pour rendre un élément impossible à manquer. Choisissez la règle d’après la fonction, pas d’après l’allure des échantillons.
- Supposer qu’une palette équilibrée est lisible. Le cercle chromatique ignore tout des rapports de contraste — un couple harmonieux peut laisser le texte à 2,5:1 sur son fond.
- Bâtir une interface à partir des seules teintes. Surfaces, bordures, états désactivés et texte courant sont surtout une même teinte à des luminosités différentes ; une bonne échelle de nuances sert plus au quotidien qu’une quatrième couleur d’accent.
- Choisir à la main les variantes survol et actif sous forme de nouveaux codes hexadécimaux. Dérivez-les en faisant varier la luminosité en HSL depuis la couleur de base, faute de quoi la famille dérive en teinte à mesure que la palette grandit.
Comparaison
| KeroTools | Galeries de palettes | Logiciels de conception | |
|---|---|---|---|
| Part de votre couleur de marque | Oui | Le plus souvent aléatoire | Oui |
| Règles d’harmonie nommées | Cinq | Rarement précisées | Oui |
| Valeurs envoyées à un serveur | Jamais | Souvent | Non |
| Compte obligatoire | Non | Souvent pour enregistrer | Licence requise |
| Fonctionne hors ligne | Après le premier chargement | Non | Oui |
| Coût | Gratuit | Gratuit / payant | Payant |
Fonctionnalités
Complémentaire
La teinte diamétralement opposée, à 180° — séparation maximale, pour un accent unique face à une couleur dominante.
Analogue
Des teintes voisines espacées d’environ 30°, qui partagent un air de famille et se lisent calmes et cohérentes.
Triadique
Trois teintes réparties tous les 120° — vives et équilibrées, mais il faut une dominante nette.
Tétradique
Quatre teintes en deux paires complémentaires ; le schéma le plus riche et le plus difficile à équilibrer.
Nuances
Une teinte déclinée en luminosité — l’échelle dont les interfaces ont réellement besoin pour les surfaces, bordures et textes.
HEX pour chaque échantillon
Chaque couleur générée porte son code, prête à copier.
Aucune installation
Rien à télécharger ni à installer : tout se passe sur la page web.
Compatible arabe et RTL
Interface complète en huit langues, dont l’arabe de droite à gauche.
Sécurisé par défaut
Servi en HTTPS, sans suivi de fichiers ni envoi à un tiers.
Qui l’utilise
Designers
Dériver un ensemble cohérent d’une couleur de marque existante au lieu d’assembler des échantillons à l’œil.
Développeurs front-end
Obtenir une échelle de nuances pour surfaces et bordures sans choisir une douzaine de gris à la main.
Petites entreprises
Étendre l’unique couleur d’un logo à un ensemble utilisable sur un site et ses supports imprimés.
Toute personne qui thématise un gabarit
Remplir les emplacements secondaire et accent réclamés par un éditeur de thème, à partir d’une seule couleur déjà en main.
Questions Fréquentes
Non. Tout s’exécute localement dans votre navigateur — rien n’est envoyé, stocké ni partagé.
Oui — entièrement gratuit, sans compte et sans limite.