Tailwind CSS utilise une échelle numérique de 11 étapes (50, 100-900, 950) pour chaque famille de couleurs, 500 étant généralement la nuance de base.
Générer des échelles dans l'espace colorimétrique OKLCH produit des étapes perceptuellement uniformes, ce qui signifie que chaque nuance apparaît également espacée pour l'œil humain.
colors: {
brand: {
'50': '#eaf0fa',
'100': '#d2e1f9',
'200': '#9ec1fa',
'300': '#6da2f8',
'400': '#3c83f6',
'500': '#0b64f4',
'600': '#0950c3',
'700': '#073c92',
'800': '#052861',
'900': '#071936',
'950': '#060d19',
},
}--color-brand-50: #eaf0fa; --color-brand-100: #d2e1f9; --color-brand-200: #9ec1fa; --color-brand-300: #6da2f8; --color-brand-400: #3c83f6; --color-brand-500: #0b64f4; --color-brand-600: #0950c3; --color-brand-700: #073c92; --color-brand-800: #052861; --color-brand-900: #071936; --color-brand-950: #060d19;