CSS: Nutzt User dunkles oder helles Theme?

Post cover image

@media (prefers-color-scheme: dark) { :root { --body-bg: black; --body-bg-stronger: rgba(255,255,255,.3); --control-bg: rgba(255,255,255,.15);

    --body-color: rgba(255,255,255,.5);
    --front-color: white;
    --active-color: rgba(255,255,255, .9);
}

}

Mit dem neuesten Update von macOS wird Safari 12.1 installiert. Damit ist Safari der erste Browser, der das neue CSS Media-Query-Feature **prefers-color-scheme** unterstützt.

Beitragsbild: cmonphotography, Quelle: Pexels

Durch das neue Feature kann abgefragt werden, ob das aktuelle Betriebssystem ein dunkles oder helles Theme nutzt. macOS hat seit dem Mojave-Update ein dunkles Theme und auch für Windows 10 soll es bald möglich sein, ein dunkles Theme einzustellen, das sich durch das gesamte System ziehen soll.

Ich nutze **prefers-color-scheme** übrigens bereits auf meiner Portfolio-Site.

Nützliche Links