Dark mode or light: the Bubble.io edition

This is how I use CSS media queries to automatically switch from light mode to dark mode based on the user's device settings. This demonstration is done in Bubble.io.

I'll be doing a written post with instructions on it and will update that here.

Tools:
https://www.bubble.io
https://codepen.io/sosuke/pen/Pjoqqp - Creating the filter for SVGs
https://atomicfusion.io/ - for code locker

Starter code:

/* Light mode */
@media (prefers-color-scheme: light) {
body {
background-color: #E1EFE6;
color: #000411;
}
}

/* Dark mode */
@media (prefers-color-scheme: dark) {
body {
background-color: #000411 !important;
color: #E1EFE6 !important;
}
}

Let me know if you have any questions or comments. Thank you!