Color Palette Generator

Teintes · nuances · propriétés CSS

Saisissez une couleur de marque et obtenez une gamme de 10 variations (50–900) en HEX, RGB et HSL. Chaque teinte est automatiquement vérifiée pour le contraste WCAG.

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 —

                                                

                                            

                                        

                                        

                                            

                                        

                                    

                                

                            

                        

                    


                    

                        
Un système de couleurs cohérent est la base de tout système de design professionnel : définir une palette structurée avec des teintes claires et des ombres sombres permet d'utiliser les couleurs systématiquement dans l'interface.
Ce générateur :
  • Prend une couleur de base en HEX, RGB ou HSL
  • Génère 10 paliers de luminosité (50, 100, 200, 300, 400, 500, 600, 700, 800, 900)
  • Affiche les valeurs en HEX, RGB et HSL pour chaque teinte
  • Vérifie le contraste WCAG AA/AAA avec du texte blanc et noir
  • Exporte les propriétés CSS pour le thème WordPress
  • Génère la map SCSS de couleurs
Combinez cet outil avec le Spacing Scale Generator et le Formateur Design Token pour un jeu de tokens complet.