Dark Mode (dark:)

Definition

Prefix dark: qui applique des styles quand le mode sombre est actif. Peut fonctionner via la media query prefers-color-scheme ou via une classe sur le HTML.

Analogie

Un interrupteur jour/nuit dans ta maison : les meubles restent, seul l'eclairage change.

Exemple de code

<div class="bg-white dark:bg-gray-900
  text-black dark:text-white">
  Mode clair et sombre automatique
</div>
// tailwind.config: darkMode: 'class'

Cas d'usage

Implementer un theme sombre sans dupliquer les composants ni gerer des variables CSS manuellement.

Termes lies