Aller au contenu
RapideTools

Générateur de Nuances

Générez une échelle de nuances depuis une couleur.

Générez une échelle de luminosité complète (de 50 à 950, comme une rampe de couleurs de design system) à partir d'une seule couleur de base. Copiez n'importe quelle valeur HEX, ou exportez toute l'échelle sous forme de variables CSS — idéal pour styliser boutons, surfaces et états de façon cohérente.

Une échelle de luminosité 50–950 prête pour les design systems et thèmes UI.

Toutes les conversions de couleur s'exécutent localement dans votre navigateur — rien n'est envoyé, stocké ni journalisé.

Comment ça marche

  1. 1 Choisissez une couleur de base.
  2. 2 Lisez l'échelle de nuances de 50 à 950.
  3. 3 Copiez le HEX dont vous avez besoin.
  4. 4 Exportez toutes les nuances en variables CSS.

Cas d'usage courants

  • Créer une rampe de couleurs pour un design system.
  • Choisir les états survol/actif à partir d'une seule couleur.
  • Styliser de façon cohérente les surfaces claires et sombres.
  • Générer des paliers de couleur à la manière de Tailwind.

Questions fréquentes

Mes données de couleur sont-elles envoyées quelque part ?

Non. Chaque conversion et chaque calcul s'exécutent entièrement dans votre navigateur — rien n'est envoyé, stocké ni enregistré.

Que signifient les chiffres ?

Ce sont des paliers de luminosité (50 = le plus clair, 950 = le plus foncé) suivant la convention utilisée par de nombreux design systems, afin que l'échelle s'intègre directement dans les thèmes d'interface.

Comment chaque nuance est-elle calculée ?

La teinte et la saturation de la couleur de base sont conservées tandis que la luminosité est réglée sur chaque palier, de sorte que toute l'échelle partage une teinte cohérente.

Est-ce vraiment gratuit ?

Oui — gratuit, sans inscription, sans filigrane et sans limites.

Générateur de Palette de Couleurs

Générez des palettes harmonieuses depuis une couleur.

Ouvrir l'outil

Convertisseur de Couleur

Convertissez entre HEX, RGB, HSL, HSV et CMYK.

Ouvrir l'outil

Vérificateur de Contraste

Vérifiez le contraste des couleurs selon WCAG AA/AAA.

Ouvrir l'outil