Pour un vrai #DarkMode, définis une palette par rôles (#primaire, #secondaire, #accent, #fond, #texte). Ensuite tu déclares chaque couleur avec light-dark(). Résultat : un thème #WordPress lisible et cohérent, clair comme sombre.
light-dark() est une fonction CSS récente.
Elle prend deux couleurs : la première est utilisée en mode clair, la seconde en mode sombre. Le navigateur choisit automatiquement selon la préférence système (ou l’override du thème).
Exemple simple :
body {
background: light-dark(#ffffff, #000000);
color: light-dark(#000000, #ffffff);
}
Résultat :
- En clair → fond blanc + texte noir.
- En sombre → fond noir + texte blanc.
Dans #WordPress, tu peux l’utiliser directement dans theme.json pour définir la palette.
Autre solution: Deux palettes, un switch.
Plutôt que d’inverser les couleurs, crée une palette #Light et une palette #Dark dans ton theme.json. Un bouton toggle applique la bonne classe (is-light / is-dark). Résultat : un #WordPress propre, cohérent et facile à maintenir.





















Laisser un commentaire