WMW

Générateur de Nuances de Couleur

Free

Générez des nuances, teintes, tons, schémas de couleurs, et tous les formats de valeur (RGB, HSL, HSV, CMYK) pour n'importe quelle couleur, avec du code CSS prêt à copier.

Fonctionne entièrement dans votre navigateur.

Cliquez sur n'importe quel code hex ci-dessous pour le copier.

Valeurs de couleur

Nuances

mélangé vers le noir

Teintes

mélangé vers le blanc

Tons

mélangé vers le gris

Répartition RVB

Répartition CMJN

Schémas de couleurs

Complémentaire

Triadique

Analogue

Monochrome

Inversé

Aperçu sur fond noir

Aperçu sur fond blanc

Code CSS

Activité récente

Visible par tous. Les 20 dernières utilisations de tous les visiteurs, les plus récentes en premier.

#3498DB

il y a 1 jour

#3498DB

il y a 1 jour

#3498DB

il y a 1 jour

#3498DB

il y a 3 semaines

Commentaires (0)

Cet outil vous a-t-il été utile ? Laissez un commentaire, partagez une astuce, ou dites-nous comment nous pourrions l'améliorer.

Les commentaires des invités sont vérifiés avant publication. Se connecter pour publier instantanément.

Pas encore de commentaires. Soyez le premier à partager votre avis !

Ce que fait cet outil

Prend une seule couleur et construit une page de référence complète autour d'elle : chaque format de valeur (HEX, RVB, TSL, TSV, CMJN, sûr pour le web), des bandes de nuance, teinte, et ton à 11 étapes, des répartitions en pourcentage RVB et CMJN, des schémas de couleurs complémentaire, triadique, analogue, monochrome, et inversé, un aperçu en direct sur noir et blanc, et des extraits CSS prêts à l'emploi, le tout généré instantanément et copiable en un clic.

Comment ça marche

Les nuances, teintes, et tons sont construits en mélangeant linéairement les canaux rouge, vert, et bleu de votre couleur vers le noir, le blanc, ou le gris moyen par paliers de 10%. Les schémas de couleurs fonctionnent plutôt dans le modèle TSL : complémentaire ajoute 180° à la teinte, triadique ajoute 120° et 240°, analogue décale la teinte de ±30°, et monochrome garde la teinte et la saturation fixes tout en balayant la luminosité, le tout s'enroulant correctement autour de la roue chromatique à 360°. TSV et CMJN sont calculés avec leurs propres formules standard directement à partir des valeurs RVB, et l'équivalent sûr pour le web arrondit chaque canal au plus proche des six paliers sûrs pour le web (0, 51, 102, 153, 204, 255).

Problèmes résolus

Questions fréquentes

Quelle est la différence entre une nuance, une teinte, et un ton ?

Ce sont les trois façons classiques de modifier une couleur tout en gardant sa teinte reconnaissable. Une nuance mélange la couleur avec du noir, la rendant plus sombre. Une teinte la mélange avec du blanc, la rendant plus claire et douce. Un ton la mélange avec du gris, l'atténuant sans la pousser vers le noir ou le blanc pur. Cet outil génère les trois sous forme de bande à 11 étapes, de la couleur d'origine jusqu'à 0%.

Comment les nuances et teintes sont-elles réellement calculées ?

Chaque étape mélange les canaux rouge, vert, et bleu de votre couleur vers la cible (noir, blanc, ou gris) selon un pourcentage fixe, la même approche simple d'interpolation linéaire utilisée par la plupart des outils de référence de couleur, plutôt que d'ajuster la luminosité en HSL. Cela maintient la progression visuellement régulière et correspond à ce que vous obtiendriez en mélangeant de la peinture ou de l'encre vers le noir, le blanc, ou le gris.

Quelle est la différence entre Complémentaire et Inversé ?

Complémentaire fait tourner uniquement la teinte de 180° sur le cercle chromatique tout en gardant la même saturation et luminosité, donc un rouge vif devient un cyan tout aussi vif, c'est la « couleur opposée » utilisée en théorie des couleurs et en design. Inversé inverse plutôt chaque valeur rouge, verte et bleue (255 moins l'original), ce qui change aussi la luminosité, le blanc devient noir par inversion, mais reste blanc avec l'opération complémentaire puisqu'il n'y a pas de teinte à faire tourner.

Que sont les schémas triadique, analogue, et monochrome ?

Triadique choisit deux autres couleurs espacées uniformément de 120° sur la roue chromatique, donnant trois couleurs à fort contraste qui restent équilibrées ensemble. Analogue choisit des couleurs à 30° de chaque côté de votre teinte, des couleurs qui se trouvent l'une à côté de l'autre sur la roue et paraissent naturellement harmonieuses. Monochrome conserve la teinte et la saturation exactes de votre couleur mais ne fait varier que la luminosité, donnant un ensemble de couleurs garanties assorties puisqu'il s'agit en réalité de la même couleur à différents niveaux de luminosité.

Que signifie « Sûr pour le web » ?

Les 216 couleurs sûres pour le web sont la palette qui s'affichait de manière identique sur les anciens écrans 256 couleurs, chaque canal rouge, vert, et bleu limité à l'une des six valeurs (0, 51, 102, 153, 204, 255). Les écrans modernes n'ont pas besoin de cette restriction, mais l'équivalent sûr pour le web reste utile comme référence pour un style rétro ou une sortie couleur extrêmement limitée.

Pourquoi les valeurs TSV et CMJN semblent-elles différentes de TSL ?

TSL, TSV, et CMJN décrivent tous la même couleur à travers différents modèles conçus pour différents usages. TSL et TSV décrivent tous deux la teinte, et la différence entre la « valeur » de TSV et la « luminosité » de TSL signifie que la même couleur peut rapporter un pourcentage de saturation différent entre les deux. CMJN décrit la quantité d'encre cyan, magenta, jaune, et noire qu'une imprimante mélangerait, ce qui suit des règles de couleur soustractive au lieu des règles de lumière additive rouge, verte, et bleue qu'utilisent RVB et TSL/TSV, ce n'est donc pas une simple conversion directe.

Puis-je copier les couleurs générées et le CSS ?

Oui. Cliquez sur n'importe quel code hex dans la ligne Valeurs de couleur, dans n'importe quel échantillon de nuance, teinte, ton, ou schéma de couleur, pour le copier dans votre presse-papiers. La section Code CSS en bas a des règles background-color, color, border-color, et box-shadow toutes prêtes avec leurs propres boutons de copie.

Outils similaires