beancuit
FR

Générateur de palette de couleurs

Transformez une couleur en palette harmonieuse et copiez-la en codes HEX ou en variables CSS.

  • 7 règles d’harmonie
  • Export en variables CSS
  • Touchez pour copier

Couleur de base

Saisissez une couleur de base.

Comment ça marche

Choisissez une couleur de base et une règle d’harmonie : une palette assortie est créée en faisant tourner la teinte sur le cercle chromatique ou en modifiant la luminosité. Touchez une pastille pour copier son code, ou copiez l’ensemble sous forme de variables CSS pour votre feuille de style.

Complémentaire = teinte + 180° · Triadique = teinte + 120° et + 240°

Règles d’harmonie

  • Complémentaire : des couleurs opposées pour un contraste fort et des boutons d’appel à l’action.
  • Analogue : des voisines sur le cercle pour un design calme et naturel.
  • Triadique et tétradique : trois ou quatre teintes régulièrement espacées pour des palettes vives et équilibrées.
  • Complémentaire adjacente : les deux voisines de la couleur opposée — du contraste avec moins de tension.
  • Monochrome, teintes claires et foncées : une seule teinte déclinée en plusieurs niveaux de luminosité, idéale pour les états d’interface.

Conseils

  • Utilisez une couleur comme ton principal, une autre comme accent et le reste avec parcimonie.
  • Vérifiez les paires texte et fond avec le vérificateur de contraste avant de publier.
  • Tout fonctionne dans votre navigateur ; rien n’est enregistré.

Normes et sources

  • Les harmonies sont calculées sur le cercle chromatique HSL défini dans le CSS Color Module Level 4

Dernière révision 7 octobre 2026

Questions fréquentes

Comment créer une palette à partir d’une seule couleur ?

Saisissez votre couleur de base et choisissez une règle d’harmonie. L’outil fait tourner la teinte sur le cercle chromatique ou modifie la luminosité pour créer des couleurs assorties.

Quelle harmonie choisir pour un site web ?

Les palettes analogues ou monochromes paraissent calmes et cohérentes ; ajoutez une couleur complémentaire comme accent pour les boutons et les liens.

Que sont les teintes claires et foncées ?

Les teintes claires sont des versions plus claires d’une couleur, les teintes foncées des versions plus sombres. Elles sont pratiques pour les états de survol, les bordures et les fonds.

Puis-je exporter la palette ?

Oui. Copiez le bloc de variables CSS, ou touchez une pastille pour copier un seul code HEX.

L’outil peut-il proposer une palette aléatoire ?

Touchez « Couleur de base aléatoire » pour partir d’une nouvelle couleur, puis changez de règle d’harmonie pour explorer.

Autres outils

CalculatriceCalculatrice simple du quotidien, avec historique et touche pourcentageCalculatrice scientifiquesin cos log √ ^ π, avec pavé degrés/radiansCalculatrice de pourcentagesX % de Y, part d’un nombre, variation en %Convertisseur d’unitésLongueur, poids et température dans chaque unitéCalculatrice de datesJours entre deux dates, ajout et soustraction de jours, semaines, mois et annéesCompteur de mots et de caractèresCaractères, mots, caractères CJK, octets UTF-8 et temps de lectureConvertisseur CSV, JSON et XMLCSV, TSV, JSON, XML et Excel dans un seul outil, avec un encodage CJK correctConvertisseur de coordonnées et carteCoordonnées décimales, DMS et DDM avec distance, carte et export GPX/KMLCalculatrice de prêtMensualité, intérêts totaux et remboursement de tout prêtIntérêts composésValeur future d’un investissement mensuel et d’un capitalPartage d’addition et pourboirePartagez l’addition, ajoutez un pourboire et arrondissez facilementCalculateur de remisePrix soldé, taux de remise, économie et prix initial en un seul endroitCalculatrice d’IMCIndice de masse corporelle, catégorie et poids sain selon la tailleMétabolisme de base et caloriesMétabolisme de base et calories quotidiennes par activitéGénérateur de mot de passeMots de passe aléatoires et forts : longueur, symboles et robustesseGénérateur de QR codeQR codes gratuits pour liens et textes, en PNG ou SVGLecteur de QR code et code-barresLisez QR codes et codes-barres avec la caméra ou une imageGénérateur de nombres aléatoiresNombres aléatoires, loto, tirage dans une liste, dés et piècesConvertisseur de casseMajuscules, minuscules, camelCase, snake_case, tri et doublonsRedimensionner une imageRedimensionner et compresser des photos en JPG, PNG ou WebPEncodeur/décodeur Base64 et URLEncodage et décodage Base64, URL, HTML, HEX et UnicodeConvertisseur de timestamp UnixTemps Unix en date et inversement, dans tous les fuseauxConvertisseur de couleursHEX, RGB, HSL et CMJN avec contraste WCAGFormateur et validateur JSONMettre en forme, minifier et valider du JSON avec la ligne d’erreurSélecteur de couleurPrélevez une couleur dans un nuancier, sur l’écran ou dans une photoGénérateur de dégradé CSSDégradés linéaires, radiaux et coniques en CSS et PNGExtracteur de couleurs d’imageTrouvez les couleurs principales d’une photo ou d’un logoVérificateur de contraste des couleursContraste WCAG AA et AAA avec correction proposée

Les résultats sont fournis à titre indicatif. Les calculs peuvent être erronés et ne constituent ni un avis juridique, ni médical, ni financier. Vérifiez toujours auprès de l’autorité compétente ou d’un professionnel avant toute décision importante.