Zen Mode

The idea

Spotify in fullscreen still shows you Spotify: sidebars, lists, buttons. Zen Mode replaces that with one large cover on frosted glass, title and artist in a serif/sans pairing, a progress bar — and a backdrop that matches whatever is playing.

It pairs with kpop-theme but works perfectly well on its own.

The scene engine

The extension reads the title, artist and album of the current track and infers a mood from them: Hangul or Kana script, known K-pop and anime artists, “OST” in the album title, lo-fi and chillhop keywords. That resolves to one of five scenes — K-pop neon night, K-drama rain, anime sunset, lo-fi rainy window — or, when nothing matches, a blurred treatment of the cover art itself.

The badge in the top-left cycles through them by hand: Auto → Anime → K-Pop → Lo-Fi → K-Drama → Album Aura → Auto.

Why all of it is SVG

Spotify’s Content-Security-Policy blocks external images and data: URIs alike. An overlay that ships its backdrops as PNGs, or fetches them, simply does not work there.

So every scene is hand-built as inline SVG — gradients, raindrops, stars, window frames, all of it markup in the DOM. That is more work than four image files, but it buys two things: it survives the CSP, and the scenes scale losslessly to any resolution and can be animated in CSS rather than shipped as video.

The details that make it

F8 toggles from anywhere — except while you are typing in an input, because focus in a search box must not launch a fullscreen mode. The controls hide themselves until the mouse moves. And all decorative animation stops the moment the OS reports prefers-reduced-motion: rain that has stopped falling is still a scene.