This page shows how to override browser's default styling in dark mode. No JS needed.

@media (prefers-color-scheme: dark) {
  h2.dark {
    color: #bae6fd; /* override the default dark mode text color white (#fff) */
  }
}
    

An h2 tag with browser's default color

An h2 tag with prefers-color-scheme override

Some text with custom background-color override.

Lorem ipsum dolor sit amet consectetur adipisicing elit. Provident reprehenderit iste eius voluptas minima a beatae iure eos debitis optio? Doloribus placeat, at minus odio neque numquam distinctio ipsam quam.