# Générateur d'Ombres de Couleur Générez des variations plus foncées d'une couleur en ajoutant du noir, créant des ombres riches pour la profondeur et le contraste dans le design > Page canonique: https://elysiatools.com/fr/tools/color-shade - **Catégorie:** Design - **Mots-clés:** couleur, ombre, assombrir, noir, profondeur, contraste, variations, plus foncé, ombre, teinte ## Présentation Le Générateur d'Ombres de Couleur permet de créer facilement des variations plus sombres d'une teinte spécifique en ajoutant du noir, offrant ainsi une solution précise pour ajouter de la profondeur et du contraste à vos interfaces et designs. ## Entrées - **Couleur de Base** (color) - **Méthode d'Ombre** (select) - **Nombre d'Ombres** (number): Combien de variations d'ombre générer - **Intensité d'Ombre** (number): Obscurité maximale (0.1-1.0) - **Distribution des Pas** (select) - **Valeurs de Pas Personnalisées** (text): Valeurs séparées par des virgules (ex: 0.1,0.3,0.5,0.7,0.9) - **Inclure la Couleur Originale** (checkbox) - **Afficher les Codes HEX** (checkbox) - **Afficher les Valeurs RGB** (checkbox) - **Afficher les Valeurs HSL** (checkbox) - **Générer une Palette Étendue** (checkbox) ## Quand l'utiliser - Pour créer des états de survol (hover) cohérents pour vos boutons et éléments interactifs. - Pour définir une palette de couleurs harmonieuse allant de la teinte claire à l'ombre profonde. - Pour ajuster le contraste d'un élément graphique afin d'améliorer sa lisibilité sur un fond complexe. ## Fonctionnement - Sélectionnez votre couleur de base via le sélecteur de couleur. - Choisissez la méthode de calcul (linéaire, HSL, LAB, etc.) pour définir comment l'ombre est générée. - Ajustez le nombre de variations souhaitées et l'intensité maximale de l'assombrissement. - Visualisez instantanément les codes HEX, RGB et HSL pour intégrer vos nouvelles nuances dans votre projet. ## Cas d'usage - Conception de systèmes de design (Design Systems) avec des palettes de couleurs complètes. - Création de dégradés personnalisés pour des arrière-plans ou des icônes. - Optimisation de l'accessibilité visuelle en générant des contrastes conformes aux normes WCAG. ## Questions fréquentes ### Quelle est la différence entre les méthodes de calcul ? Les méthodes comme HSL ou LAB ajustent la luminosité de manière plus naturelle pour l'œil humain, tandis que la méthode linéaire ajoute simplement du noir pur. ### Puis-je obtenir les valeurs en format RGB ? Oui, en cochant l'option 'Afficher les valeurs RGB', l'outil génère automatiquement les équivalents numériques pour chaque nuance créée. ### Combien de nuances puis-je générer à la fois ? Vous pouvez générer entre 2 et 12 variations d'ombre selon vos besoins de design. ### L'outil inclut-il ma couleur d'origine ? Oui, vous pouvez activer l'option 'Inclure la couleur originale' pour voir la base et ses dérivés côte à côte. ### Qu'est-ce que la distribution des pas ? Elle définit la progression de l'assombrissement : 'Exponentiel' rend les ombres plus sombres rapidement, tandis que 'Logarithmique' offre une transition plus douce. ## Outils associés - [Couleurs Analogues](https://elysiatools.com/fr/tools/color-analogous): Générer des schémas de couleurs analogues harmonieux avec des couleurs adjacentes sur la roue chromatique, créant des combinaisons unifiées et paisibles - [Générateur de dégradé de couleurs](https://elysiatools.com/fr/tools/color-gradient-generator): Génère des dégradés de couleurs fluides entre plusieurs couleurs avec des étapes et formats personnalisables - [Décaleur de Teinte de Couleur](https://elysiatools.com/fr/tools/color-hue-shifter): Ajustez la teinte des couleurs et créez des variations avec des contrôles de rotation horaire/antihoraire - [Éclaircissement/Abscissement de Couleur](https://elysiatools.com/fr/tools/color-lighten-darken): Ajustez la luminosité des couleurs et créez des variations - [Saturation/Désaturation de Couleur](https://elysiatools.com/fr/tools/color-saturate-desaturate): Ajustez la saturation des couleurs et créez des variations de saturation - [Générateur de Schémas de Couleurs](https://elysiatools.com/fr/tools/color-scheme-generator): Génère des schémas de couleurs et des palettes professionnels pour les projets de design - [Outil de Couleurs Complémentaires Divisées](https://elysiatools.com/fr/tools/color-split-complement): Générer des schémas de couleurs complémentaires divisées avec un contraste harmonieux en utilisant une couleur de base et deux couleurs adjacentes à son complément - [Outil de Tétrade de Couleurs](https://elysiatools.com/fr/tools/color-tetrad): Générer des schémas de couleurs tétradiques avec quatre couleurs disposées en motifs rectangulaires sur la roue chromatique, créant des relations de couleurs riches et complexes ## Exemples - [Exemples de codes couleur](https://elysiatools.com/fr/samples/color-code): Collection de codes de couleur dans différents formats (Hex, RGB, HSL, couleurs nommées) pour les tests de validation - [Exemples de Traitement d'Images Android Java](https://elysiatools.com/fr/samples/android-image-processing-java): Exemples de traitement d'images Android Java incluant lecture/écriture, mise à l'échelle et conversion de format - [Exemples de Traitement d'Images Android Kotlin](https://elysiatools.com/fr/samples/android-image-processing-kotlin): Exemples de traitement d'images Android Kotlin incluant lecture/écriture, mise à l'échelle et conversion de format - [Exemples de Traitement d'Images Web Python](https://elysiatools.com/fr/samples/web-image-processing-python): Exemples de traitement d'images Web Python utilisant PIL/Pillow incluant la lecture, l'enregistrement, le redimensionnement et la conversion de format ## Contenu associé - [Outils pour un système de couleurs accessible](https://elysiatools.com/fr/hubs/color-design-tools): Construisez un système de couleurs réutilisable en transformant les couleurs, générant des harmonies, vérifiant le contraste et documentant les tokens. - [Workflow de systeme coloré et d'effets CSS](https://elysiatools.com/fr/hubs/design-generate): Extraire une palette, construire des relations accessibles, générer des tokens et appliquer des effets CSS cohérents sur de vrais états d'interface.