Logo WPDistrib, fond transparent, version principale du visuel

Stop au simple “inverser les couleurs”

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

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *


Logo WPDistrib, fond transparent, version principale du visuel

Stop au simple “inverser les couleurs”

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

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *


  • Logo WPDistrib, fond transparent, version principale du visuel

    🧐 Avis WPDistrib de User Switching 🔵 Optionnel

    User Switching est une extension WordPress permettant de basculer instantanément d’un compte utilisateur à un autre sans se déconnecter. WPDistrib vous explique pourquoi cette solution reste utile et optionnelle selon les projets.

    🧐 Avis WPDistrib de User Switching 🔵 Optionnel
  • Logo WPDistrib, fond transparent, version principale du visuel

    🧐 Avis WPDistrib de Members 🔵 Optionnel

    WPDistrib recommande Members comme extension optionnelle pour créer des rôles intermédiaires et sécuriser l’accès à l’administration WordPress.

    🧐 Avis WPDistrib de Members 🔵 Optionnel
  • Logo WPDistrib, fond transparent, version principale du visuel

    🧐 Avis de WPDistrib sur GenerateBlocks 🔴 Non recommandé

    GenerateBlocks était une extension clé pour améliorer Gutenberg. Mais avec les évolutions récentes de WordPress et l’adoption du thème FSE 2025, WPDistrib ne recommande plus son utilisation.

    🧐 Avis de WPDistrib sur GenerateBlocks 🔴 Non recommandé
  • Logo WPDistrib, fond transparent, version principale du visuel

    🧐 Avis de WPDistrib sur Admin Menu Search 🟢 Inclus

    Admin Menu Search est une extension recommandée par WPDistrib pour rechercher facilement dans les menus d’administration WordPress et optimiser votre navigation.

    🧐 Avis de WPDistrib sur Admin Menu Search 🟢 Inclus
  • Logo WPDistrib, fond transparent, version principale du visuel

    🧐 Avis de WPDistrib sur Duplicate Page 🟢 Inclus

    Duplicate Page est l’extension recommandée par WPDistrib pour dupliquer facilement vos contenus WordPress. Simple, rapide et sans configuration complexe, elle optimise vos tâches courantes.

    🧐 Avis de WPDistrib sur Duplicate Page 🟢 Inclus