Quand on parle design, on parle forcément de charte graphique et donc, de palette de couleurs. Difficile de faire un choix entre les millions de nuances qui existent, et si malgré tout tu as réussis à te concentrer sur 4 ou 5 d'entre elles, il faut encore que le tout soit cohérent et en accord avec la direction portée par ton design.

Heureusement pour toi petit vénard, un joyeu luron du nom de Fabrizio Bianchi a créé un outil en ligne ultra pratique pour générer sa palette de couleurs : coolors.co

coolors.co le générateur de palettes de couleurs

 

Générer sa palette de couleurs

Le générateur (accessible directement ici) est hyper simple d'utilisation. Avec la barre Espace tu génères une schéma de 5 couleurs à chaque fois. Voilà tu l'as ta palette ^^ Bon, si ça ne te plait pas direct, tu appuie à nouveau sur Espace et tu as une nouvelle palette.

le générateur de palettes de couleurs coolors.co

- Le générateur de coolors.co. Je n'aurai jamais pensé à ce magnifique vert citron et ce violet ensemble.

 

"Ah tiens ! Ce jaune et ce rose me vont bien mais pas les 3 autres couleurs", aucun problème Michel, tu peux vérouiller les couleurs qui te plaisent, et continuer de générer les autres avec Espace, tout en gardant une cohérence dans ta palette. C'est magique !

coolors.co permet de verrouiller une couleur pour continuer de générer les autres

- En cliquant sur une couleur, tu accèdes à quelques options dont le vérouillage avec l'icône du cadenas.

 

Ce qui arrive souvent aussi, c'est qu'on a déjà 2 ou 3 couleurs, et on ne sait pas ce qui pourrait aller avec. Il suffit d'entrer directement le code hex de tes couleurs (#FFFFFF par exemple), de les vérouiller, et de générer les restantes. 

coolors.co permet d'entrer manuellement une code hex d'une couleur pour l'ajouter à la palette

- En cliquant sur une couleur, tu accèdes à quelques options dont l'édition du code Hex de la couleur.

 

Autre fonction utile, la pipette du style photoshop, mais en mieux. Tu upload une photo ou tu insère son lien et là coolors.co te propose son code hexa. Mais là où il fait fort c'est qu'il te propose aussi d'autres nuances qui correspondent à l'image.

coolors.co permet de capturer une couleur à partir d'une image

coolors.co génère une palette de couleurs à partir d'une image

- Si tu cliques sur "Auto", il te propose d'autres palettes, toujours en accord avec l'image.

 

Pour continuer, tu as la possibilité d'ajuster la palette entière si tu trouves qu'elle mériterai un brin de saturation en plus par exemple : tu as accès à la teinte, la saturation, la luminosité et la température.

coolors.co permet de modifier la teinte, la saturation, la luminosité et la température de la palette de couleurs en entier

 

 

Et pour finir, là c'est le summum, tu peux voir ta palette déclinée en pluseurs nuances. Là c'est fort.

coolors.co permet d'affcher toutes les nuances de la palette de couleurs

coolors.co affiche toutes les nuances liées à la palette de couleurs

 

Créer ta bibliothèque

L'outil prend tout son sens quans tu créer ton compte. Quelques minutes reloues pour enfin savourer tout le potentiel de coolors.co. 

Avec un compte, tu pourras sauvegarder toutes les palettes que tu auras créé ! Elles seront accessibles de n'importe où, notemment grâce à leur app iOS, au plug-in Photoshop (oui oui) et à l'extension Chrome.

coolors.co permet de sauvegarder ses palettes en créant son compte

 

Besoin d'inspiration ?

Là aussi, le créateur de coolors.co pense à tout, il propose aux utilisateurs de partager leurs palettes. Ca donne une bonne grosse dose d'inspi ! 

Et deuxième intérêt de créer son compte, tu vas pouvoir sauvegarder dans ta bibliothèque les palettes des autres !

coolors.co permet de partager ses palettes, d'accéder à celles des autres et de les sauvegarder dans sa bibliothèque.

 

Voir sa palette comme les daltoniens !

Bien sûr on ne peut pas adapter sa charte de couleurs à toutes les altérations de couleurs. Mais au moins ça permet de vérifier si deux graphismes de vont pas se confondre car ils prendront le même ton.

coolors.co permet de voir sa palette à travers plusieurs altérations de couleurs comme le daltonisme

 

Exporter sa palette en SVG et en références COPIC©

Pour finir sur l'éloge de cet outil incroyable, tu as la possibilité d'exporter ta palette sous différents formats classiques tels que PNG ou encore PDF (pas de jpeg, c'est trop classique).

coolors.co permet d'exporter sa palette en différents formats

 

Tu peux aussi exporter en SVG et en CSS ! Très pratique pour bosser directement avec nos amis les ingénieurs informaticiens ^^

Et enfin, tu peux avoir les références correspondantes pour tes feutres COPIC©, ça c'est la cerise sur le gâteau !

coolors.co permet d'avoir sa palette adaptée en références des feutres copic

 

Plusieurs autres outils sur le web permettent de créer ou du moins d'aider à la création de sa palette de couleurs, comme Flat colors ou encore Color Tool. Mais personnellement je ne suis jamais tombée sur plus complet que le générateur de coolors.co

Mais je suis toujours preneuse ! Est-ce que tu en aurai trouvé un encore plus merveilleux ? N'hésites pas à nous le faire savoir en commentaire !

Références


Besoin d'un site internet, d'une application, de services de motion design ou de community management ?