/* Let the OS preference guide us */
@media (prefers-color-scheme: dark) {
:root {
--bg-color: #1a1a2e;
--text-color: #e0e0e0;
}
}
/* Simple, non-invasive theming */
body {
background: var(--bg-color, #fff);
color: var(--text-color, #333);
transition: all 0.3s ease;
}
The browser already handles theme preferences. We simply respond to what the user has chosen at the OS level.
Wu Wei: Don't force, just flow with user intent.
Trust browser & the user.