Couleurs en React inline style et exemples variables CSS
Les projets React doivent eviter de disperser les codes HEX dans les composants. Gardez les couleurs dans des tokens, variables CSS ou objets palette.
Exemple objet couleur React
const colors = {
primary: '#2563eb',
text: '#111827',
surface: '#ffffff',
};
export function Badge() {
return (
<span style={{ color: colors.primary, background: '#eff6ff' }}>
New
</span>
);
}Checklist developpeur
- Evitez les couleurs dupliquees dans beaucoup de composants.
- Preferez les variables CSS pour changer de theme.
- Gardez les etats interactifs lisibles dans les deux modes.