« All posts

Study of 58 Homepages Finds Dark Mode CSS Rules That Never Activate

A headless Chromium test of 58 homepages reveals five ship dark-mode CSS that never renders dark, exposing gaps in how sites use prefers-color-scheme.

A methodical test of 58 homepages in headless Chromium — rendered once with light and once with dark forced via prefers-color-scheme, then compared by computed colors — found only 9 sites actually respond to the OS setting. More notable: five major sites (NYTimes, Stack Overflow, Microsoft, Amazon, Airbnb) ship a first-party dark-mode media query that never fires, likely overridden by a more specific rule in the cascade or gated behind a class that only an in-app toggle sets.

The study also surfaces measurement pitfalls relevant to anyone auditing CSS at scale. Three responsive sites (Cloudflare, Substack, Ars Technica) drive dark mode entirely through a JS-toggled class on the html element with no media query present at all, meaning a grep-based audit would miss them completely. A false positive traced to WebMD turned out to be an embedded Google widget served from gstatic.com, not the site's own styles. And a network-based stylesheet capture on Tailwind's own site produced a false negative — the media query was there, just missed until the DOM's stylesheet list was walked directly.

Separately, the color-scheme CSS property — which controls native form controls and scrollbars — is used by only 10 of the 58 sites, leaving several dark-themed pages with light scrollbars and dropdowns by omission. The author, who builds a Safari extension that forces dark rendering on unsupporting sites, leaves open whether the five 'dead' dark-mode rules are intentional defaults awaiting a stored preference, or simply leftover code from a manual toggle implementation.

This synthesis was produced from its source by AI; there is no human editor or manual review step. How we work