Color Palette Generator

Teintes · nuances · propriétés CSS

Le Color Palette Generator construit des échelles de couleurs (50–950) à partir d’une ou plusieurs bases, avec courbes de saturation et algorithmes de type HSL, OKLCH ou LAB. Exportez un bloc :root avec des variables sémantiques, copiez le JSON des tokens et contrôlez le contraste WCAG pour des paires texte/fond typiques — idéal pour aligner Figma et le CSS.

Couleur de base
H 263°
S 76%
L 56%
Couleurs de la palette
Échelle
Pas
Algorithme
Courbe de saturation
Sortie CSS
Inclure :root
Inclure HSL brut
Format OKLCH
Variables sémantiques
Préfixe de nom 

                                        

                                        

                                            

                                                
Contraste texte sur fond —

                                                

                                            

                                        

                                        

                                            

                                        

                                    

                                

                            

                        

                    


                    

                        
Pourquoi un générateur de palette

                        
  • Cohérence design system : des pas 50–950 proches de Tailwind facilitent thème et mode sombre.
  • Export prêt à coller : custom properties dans :root, HSL optionnel et noms sémantiques pour les composants.
  • Accessibilité : vue WCAG pour valider des paires texte/fond sur vos tokens.
Combinez cet outil avec le Spacing Scale Generator et le Formateur Design Token pour un jeu de tokens complet.