@media prefers-color-scheme

.day   { background: #eee; color: black; }
.night { background: #333; color: white; }

@media (prefers-color-scheme: dark) {
  .day.dark-scheme   { background:  #333; color: white; }
  .night.dark-scheme { background: black; color:  #ddd; }
}

@media (prefers-color-scheme: light) {
  .day.light-scheme   { background: white; color:  #555; }
  .night.light-scheme { background:  #eee; color: black; }
}

.day, .night {
  display: inline-block;
  padding: 1em;
  width: 7em;
  height: 2em;
  vertical-align: middle;
}

Source: developer.mozilla.org

Similar codes

0 vote353 views1 answer
Check browser on css
CSS
0 vote381 views1 answer
Menu always center css
CSS
4 votes338 views1 answer
Max css
CSS
0 vote305 views1 answer
Restrict css to apply on div
CSS
21 votes350 views2 answers
Remove color and underline from link css
CSS
45 votes329 views6 answers
How to remove background color in css
CSS
1 vote364 views2 answers
Image to fill container size
CSS
19 votes391 views6 answers
Box shadow
CSS
0 vote369 views1 answer
Swiper center slides but not first slide
CSS
1 vote399 views3 answers
Css hover animation text
CSS