Générateur de Teintes et Nuances
Générez des teintes et nuances pour n'importe quelle couleur. Choisissez une couleur de base et le nombre de nuances, obtenez des valeurs HEX, RGB et HSL. Gratuit, 100% dans votre navigateur.
Référence
Que sont les teintes et les nuances ?
En théorie des couleurs, une teinte est une couleur mélangée avec du blanc (la rendant plus claire), et une nuance est une couleur mélangée avec du noir (la rendant plus foncée). Ensemble, elles forment une palette monochromatique — des variations d'une seule teinte à différents niveaux de luminosité. Cet outil génère une gamme complète du blanc à travers votre couleur de base jusqu'au noir, vous donnant une rampe de couleurs prête à l'emploi pour le design et le développement.
Cas d'utilisation des nuances de couleur
Systèmes de design — générez une échelle de 9 ou 11 niveaux pour une couleur de marque, suivant le modèle utilisé par Tailwind CSS (50–950), Material Design et la plupart des systèmes de design modernes. États des composants UI — utilisez les teintes claires pour les arrière-plans et les états de survol, la couleur de base pour les actions principales, et les nuances sombres pour le texte, les bordures et les états actifs. Visualisation de données — créez des échelles de couleur séquentielles clair-à-foncé pour les cartes choroplèthes, les cartes de chaleur et les graphiques où l'intensité représente la magnitude. Accessibilité — trouvez des paires de nuances qui respectent les exigences de ratio de contraste WCAG (4,5:1 pour le texte normal, 3:1 pour le texte large).
Comment les nuances sont générées
Les nuances sont générées par interpolation linéaire dans l'espace RVB du blanc (#FFFFFF) à travers la couleur de base jusqu'au noir (#000000). Pour N nuances, la couleur de base apparaît au milieu de l'échelle. Chaque étape se mélange uniformément, produisant une progression de luminosité cohérente. La sortie est disponible aux formats HEX, RVB et TSL — copiez les valeurs individuelles ou la palette entière en une fois.
Confidentialité
Toute la génération de couleurs s'exécute 100% dans votre navigateur. Aucune donnée n'est envoyée à un serveur.