Découvrez Color Studio, notre générateur de palettes de couleurs
Notre nouveau Studio de couleurs est un générateur de palettes gratuit pour les sites web et les applications. Couleurs assorties, nuances, vérification du contraste et dégradés CSS sont réunis dans un même espace : vous gardez votre palette sous la main à mesure que votre idée prend forme. Tout fonctionne dans le navigateur, sans compte, en français ou en anglais.
Trouver une combinaison qui vous plaît
Vous pouvez partir d’une couleur que vous utilisez déjà, parcourir 48 palettes prêtes à l’emploi ou en générer une nouvelle. La collection va des pastels et tons terreux aux associations vives, en passant par les teintes neutres rehaussées d’un accent coloré.
Le cercle interactif permet d’explorer facilement les associations. Essayez des teintes voisines pour un résultat plus doux, ou des couleurs complémentaires pour un contraste de teinte plus marqué. Déplacez une couleur sur le cercle : les autres suivent l’harmonie choisie. Verrouillez celles que vous souhaitez garder et utilisez Annuler lorsqu’un essai vous éloigne du résultat recherché.
Passer de la palette à l’interface
Quelques beaux échantillons sont un point de départ. Un site a aussi besoin de fonds, de libellés lisibles et de boutons qui se distinguent.
Le Studio de couleurs peut créer des nuances plus claires et plus sombres pour ces usages ; un clic suffit pour copier leur code. Son vérificateur de contraste compare le texte à son fond et peut proposer un ajustement de l’une ou de l’autre couleur. Chaque paire doit être vérifiée séparément : une palette harmonieuse ne rend pas automatiquement une interface accessible.
Pour l’intégration, vous pouvez convertir les couleurs entre HEX, RGB, HSL, Oklab et OKLCH, composer un dégradé CSS ou exporter la palette sous forme de variables CSS, de SCSS ou de JSON. De quoi avancer aussi bien sur une maquette que dans une feuille de style.
Essayez vos choix sur une petite carte ou un formulaire avant de les appliquer partout. Si la mise en page manque encore de contenu, les options HTML et listes du générateur de Lorem Ipsum permettent de juger le résultat avec des textes de différentes longueurs.
Garder une idée pour plus tard
Une combinaison vous plaît ? Copiez son lien de partage ou conservez son code de palette. Vous pourrez la retrouver plus tard ou l’envoyer à un collègue, qui pourra explorer ses propres variantes. Gardez des liens distincts pour les idées que vous souhaitez comparer.
Essayez le Studio de couleurs avec votre couleur de marque, ou choisissez une palette de départ pour vous laisser inspirer.