Astuces pour trouver les couleurs parfaites pour le webdesign

Quand vous créez un nouveau webdesign sous Photoshop vous avez souvent en tête les dominantes de couleurs à utiliser : du bleu, du rouge du orange. Mais comment faite vous pour trouver la bonne tonalité de bleu, de rouge, ou de orange ? Si la réponse est : choisir la couleur à la main directement dans le picker de Photoshop. Je vous conseille fortement de lire l’article suivant.

Car les couleurs ne se choisissent pas au hasard. Les couleurs permettent de passer des messages et de guider intuitivement l’utilisateur vers la thématique souhaitée. Ainsi vous ne choisirez pas du rouge pour un site sur les plantes, ou du noir pour un site médical. Mais je suis sûr que vous le saviez déjà.

Mais les couleurs vont plus loin, et permettent également de passer des émotions. Et cela passe par le choix de la tonalité. Par exemple pour du bleu vous avez le choix entre acier, aigue marine, azur, bondi, égyptien, givré, maya… bien sur la liste est très longue et cette liste ne comporte que les couleurs nommées, vous pouvez compléter cette liste de couleurs personnalisées. Vous devrez alors choisir parmi plusieurs milliers de couleurs.

Une fois ce choix fait vous devrez choisir les couleurs à combiner et pour chacune d’elle les tonalités à associer. Le résultat de ce choix sera un webdesign plus ou moins fluide à regarder.

Pour vous aider à faire ce choix, je vous livre aujourd’hui les outils que j’ai l’habitude d’utiliser. Ils permettent soit de trouver une couleur grâce à un outil, une photographie ou une communauté d’autres webdesigners.
Bonne découverte.

Trouver une couleur

Ces outils vous permettent de choisir une couleur directement à l’écran en vous donnant toutes les informations relatives à elle. Tonalités, couleurs associés, code RVB et hexadécimal etc. Très pratique pour créer une nouvelle palette.

Color Hail Pixel

Outils pour webdesigners Screen 01
Faite glisser votre curseur de souris sur l’écran pour créer en quelques secondes une palette de couleur.
Visiter ce site

Kuler by Adobe

Outils pour webdesigners Screen 02
L’un des outils que j’aime le plus, faite simplement glisser l’outil sur les couleurs pour qu’ils vous donnent les couleurs s’associant le mieux. Vous pouvez ensuite modifier les réglages pour trouver d’autres couleurs.
Visiter ce site

The colors of motion

Outils pour webdesigners Screen 03
Concept très intéressant vous proposant des couleurs par rapport aux thématiques des films les plus connus.
Visiter ce site

Flat UI Colors

Outils pour webdesigners Screen 04
Un picker spécialement dédié aux couleurs utilisées dans les interfaces en flat design. Les couleurs sont limitées mais permettent de récupérer des couleurs efficaces rapidement.
Visiter ce site

Paletton

Outils pour webdesigners Screen 05
Outil très propre et facile d’utilisation, sélectionnez une couleur dans le picker pour obtenir une palette de tonalité (partant de la couleur sélectionnée).
Visiter ce site

Trouver des couleurs à partir d’une photographie

Ces outils permettent à partir d’une photographie de trouver les couleurs dominantes. Vous pouvez ainsi en quelques secondes former une palette de couleurs tout à fait compatible avec vos illustrations.

Degraeve

Outils pour webdesigners Screen 06
Entrez l’url d’une image sur internet et obtenez une liste des couleurs dominantes avec leurs codes hexadécimaux.
Visiter ce site

Color Hunter

Outils pour webdesigners Screen 07
Même concept, entrez l’url d’une photo et obtenez les couleurs dominantes.
Visiter ce site

Colour Grab

Outils pour webdesigners Screen 08
Toujours le même concept, mais vous obtiendrez grâce à ce site un peu plus d’information.
Visiter ce site

Pictaculous

Outils pour webdesigners Screen 09
Travail ici sur une image prise à partir de votre ordinateur. Un tas d’information pratique et surtout la possibilité de télécharger la palette pour l’importer dans Photoshop. Vraiment pratique.
Visiter ce site

Colr

Outils pour webdesigners Screen 10
Concept amusant, charger une image ou ajouter une url directement dans le formulaire. L’outil vous propose les couleurs directement sur la photo, à vous ensuite de choisir celle que vous voulez.
Visiter ce site

Trouver une image à partir de couleurs

De façon inverse les outils suivant vous permettent de trouver les illustrations idéales pour vos webdesigns. Choisissez une ou plusieurs couleurs, le moteur de recherches se charge de vous trouver les photos utilisant les mêmes couleurs.

Tineye

Outils pour webdesigners Screen 11
Sélectionnez une, deux ou trois couleurs, la partie gauche se rechargera en vous proposant à chaque fois une quantité de photographies comportant les couleurs choisies. L’outil est impressionnant et vraiment efficace. A tester !
Visiter ce site

DesignInspiration

Outils pour webdesigners Screen 12
Même concept qu’au-dessus, pour trouver des illustrations et dessins.
Visiter ce site

Shutterstock Spectrum

Outils pour webdesigners Screen 13
Associer une couleur et un mot clé pour avoir une sélection de belles photographies. Personnellement je trouve l’outil facile d’utilisation et vraiment pratique. Attention les résultats proviennent de la base de données de shutterstock donc payant. Mais rien que pour tester ça vaut bien un clic !
Visiter ce site

Trouver les couleurs grâce à la communauté des webdesigners

Ces sites sont de véritable source d’inspiration. En plus de vous proposer des outils ces sites donnent la possibilité à la communauté de publier leurs propres palettes de couleurs (mais aussi dégradés, couleurs, photographies). Si vous manquez d’idées ces sites sont faits pour vous.

Colrd

Outils pour webdesigners Screen 14
Site vraiment simple à utiliser, de très bonnes idées de couleurs autour de grandes thématiques comme : dégradés, photos, palettes etc.
Visiter ce site

Colour Lovers

Outils pour webdesigners Screen 15
Une référence pour les amoureux des couleurs ! Une communauté forte, dynamique autour des choix de couleurs. Plein d’idées et de conseils pour trouver la palette parfaite.
Visiter ce site

Pour faire simple choisir ses couleurs ne peux s’improviser. Même si vous êtes un professionnel du webdesign je vous invite à utiliser ces outils qui ne pourront que vous aider dans vos travaux graphiques.

Pour terminer, vous devriez peut être faire profiter vos amis de cet article ? Si vous souhaitez partager cette page sur facebook, twitter ou google + en cliquant sur les boutons ci-dessous.

Commentaires