Prefers color scheme 🍹 HTMLcat

This CSS media feature detects if the user has requested a light or dark color theme for the user interface. It's useful for implementing dark mode in web applications.

@media (prefers-color-scheme: dark) {
  body {
    background-color: #333;
    color: #fff;
  }
}

@media (prefers-color-scheme: light) {
  body {
    background-color: #fff;
    color: #333;
  }
}