a11y.skipToMainContent
1

Générateur de nuances de couleurs

Introduisez n'importe quelle couleur d'hexagone et générez instantanément 10 nuances (50-950) dans le style Tailwind CSS — visualisez les swatches, cliquez pour copier et exportez les configs.

Was this tool helpful?
Send Image to:
Advertisement

How to use Color Shades Generator

  1. Saisissez une couleur hexagonale ou utilisez le picteur de couleur.
  2. Visualisez l'échelle de 10 nuances générée de 50 à 950.
  3. Cliquez sur des swatchs individuels pour copier des codes hexagonaux, ou utilisez les boutons d'exportation pour une configuration complète.

Quel est {nom} ?

Créer des échelles de couleurs cohérentes est essentiel pour les systèmes de conception. Cet outil prend n'importe quelle couleur de base hexagonale et génère un ensemble complet de 10 teintes de 50 (le plus léger) à 950 (le plus sombre), suivant la convention de l'échelle de couleurs CSS Tailwind.

Chaque teinte est affichée sous forme de swatch couleur avec son code hexagonal. Cliquez sur n'importe quel swatch pour copier l'hexagone dans votre presse-papiers. Exporter la palette complète sous forme de valeurs hexagonales, de propriétés personnalisées CSS ou d'un objet de configuration CSS prêt à utiliser Tailwind.

Advertisement

FAQ

Comment les nuances sont-elles calculées?
Les nuances sont calculées en mélangeant la couleur de base avec le blanc (pour les nuances plus légères 50-400) et le noir (pour les nuances plus foncées 600-950), avec une interpolation perceptuellement équilibrée.
Puis-je l'utiliser pour mon système de conception?
Oui — l'exportation de configuration Tailwind est prête à coller dans votre vent arrière. config.js pour les couleurs de marque personnalisées.

Related tools

Author

AR
Aisha Rahmani"The Visual Storyteller"

Design Technologist & Media Specialist

Aisha bridges the gap between pixels and code. With expertise in image processing, SVG optimization, and video compression, she helps creators, designers, and marketers prepare media that looks great and loads fast. She has spoken at design conferences about accessible visual content and has helped agencies reduce page-weight budgets by up to 60 percent without sacrificing creative quality.

📖 Color Shades Generator on Wikipedia·Image Tools on Wikipedia·Color Shades Generator on Britannica

People also use

← Back to Image Tools · All tags
Advertisement