Paolo Redaelli personal blog

Tag: CSS

Elena, the tiny library to build Progressive Web Components.

██████████ ████░░███░░░░░█░░███ ░███ █ ░ ░███ ██████ ████████ ██████ ░██████ ░███ ███░░███░░███░░███ ░░░░░███ ░███░░█ ░███ ░███████ ░███ ░███ ███████ ░███ ░ █ ░███ ░███░░░ ░███ ░███ ███░░███ ██████████ █████░░██████ ████ █████░░████████░░░░░░░░░░ ░░░░░ ░░░░░░ ░░░░ ░░░░░ ░░░░░░░░░█ Simple, tiny library for building Progressive Web Components.| Elena is a simple, tiny library (2.6kB) for building Progressive Web…

This css one liner can define how your site looks on a device with dark mode set in the browser settings.

@media (prefers-color-scheme: dark)

Or if your main style is dark mode, you can define how the light mode will look.

@media (prefers-color-scheme: light)
Source: CSS only dark mode without JS – Simon Dalvai