Eine Webseite barrierefrei zu gestalten, dazu gehört heute auch der automatische Wechsel zwischen Dark- und Lightmode. Das mit CSS zu ermöglichen ist denkbar einfach.

Man definiert Variablen und verwendet diese dann wie bei dieser Webseite hier für die Hintergrundfarbe und die Farbe der Texte. Mehr als das folgende muss man im CSS nicht hinzufügen.

:root {
   --body-bg: #FFFFFF;
   --body-color: #000000;
}

/* Dark mode */
@media (prefers-color-scheme: dark) {
   :root {
       --body-bg: #000000;
       --body-color: #FFFFFF;
   }
}
body {
   background: var(--body-bg);
   color: var(--body-color);
}

Wenn jetzt ein Besucher mit aktiviertem Darkmode daherkommt, wird die Webseite mit schwarzen Hintergrund und weißer Schrift ausgeliefert. In allen anderen Fällen wird der Standard, weißer Hintergrund und schwarzer Text ausgeliefert.