Command Palette

Search for a command to run...

GÉ

Générateur de nuances de couleur

Générez des teintes, des nuances et des tons à partir de n’importe quelle couleur de base

Qu'est-ce qu'un générateur de nuances de couleur ?

Un générateur de nuances de couleur prend une couleur de base et construit une échelle monochromatique de versions plus claires et plus foncées de celle-ci À partir d'une seule entrée telle que #4466EE, il produit une rangée de teintes qui se dirigent vers le blanc, une rangée de nuances qui se dirigent vers le noir et une rangée de tons qui se dirigent vers le gris Chaque swatch est une vraie couleur que vous pouvez copier en HEX, RVB ou HSL et passer directement dans CSS, un fichier de conception ou une configuration de thème.

Les trois échelles proviennent des définitions classiques utilisées dans la théorie des couleurs Une teinte est la couleur de base mélangée au blanc, qui élève sa légèreté tout en gardant la même teinte Une teinte est la base mélangée au noir, qui l'assombrit Un ton est la base mélangée au gris, qui réduit son intensité et donne une version muette, plus sophistiquée, de la couleur Avoir les trois à partir d'une seule entrée est ce qui vous permet de construire une palette cohérente : un bouton et son état de vol stationnaire, un ensemble de séries de graphiques, ou les surfaces claires et sombres d'une interface, toutes dérivées d'une seule couleur de marque.

Le générateur fonctionne entièrement dans votre navigateur La couleur que vous saisissez est analysée et les échelles sont calculées avec JavaScript côté client, donc rien n'est téléchargé, il n'y a pas de compte et votre travail n'est jamais suivi. Il accepte les noms de couleurs HEX, rgb (), hsl () et CSS courants, vous permet de définir le nombre d'étapes que contient chaque échelle et met à jour chaque échantillon instantanément. Une fois que la page est chargée, elle fonctionne hors ligne.

Comment utiliser le générateur de nuances de couleur ?

  1. Entrez une couleur de base

    Tapez ou collez une couleur dans n'importe quelle syntaxe courante : un code HEX comme #4466EE, une valeur rgb () ou hsl (), ou un nom de couleur CSS comme teal.

  2. Définissez le nombre d'étapes

    Choisissez le nombre de variations que chaque échelle doit contenir Plus d'étapes donnent un dégradé plus fin de la base vers le blanc, le noir ou le gris.

  3. Passez en revue les teintes, les nuances et les tons

    L'outil montre trois échelles côte à côte, chaque échantillon étant étiqueté avec sa valeur HEX et le pourcentage mélangé à la couleur cible.

  4. Copiez la couleur dont vous avez besoin

    Cliquez sur n'importe quel swatch pour copier sa valeur Changez le format de copie entre HEX, RVB et HSL pour correspondre à la syntaxe attendue par votre projet.

Principales caractéristiques

  • Teintes, nuances et tons

    Une couleur de base produit trois écailles complètes à la fois : des teintes plus claires, des nuances plus foncées et des tons sourds vers le gris.

  • Chaque valeur copiable

    Chaque swatch est disponible sous forme HEX, RVB et HSL, vous pouvez donc le coller directement dans CSS, un outil de conception ou un fichier thématique.

  • Étapes réglables

    Réglez de 2 à 20 étapes par échelle pour contrôler la finesse du dégradé entre la couleur de base et le blanc, le noir ou le gris.

  • Entrée pardonnante

    Accepte les valeurs HEX, rgb () et hsl () à 3 et 6 chiffres, et les noms de couleurs CSS courants, tous normalisés aux mêmes échantillons.

Frequently Asked Questions

Une teinte est une couleur mélangée au blanc, ce qui la rend plus claire Une teinte est une couleur mélangée au noir, ce qui la rend plus foncée Un ton est une couleur mélangée au gris, qui la coupe sans changer si elle est claire ou foncée Tous les trois gardent la teinte originale et ne changent que la façon dont la couleur apparaît claire, sombre ou saturée.

Comments

0 comments

0/2000 characters

No comments yet. Be the first to share your thoughts!

color shades generatortint and shade generatorshades of a colormonochromatic palettelighter and darker colorscolor tintscolor toneshex shade generator