I built a liquid-glass Spotify mini player for Windows

Mugheez Asif — Sun, 15 Nov 2026 09:21:20 +0000

I wanted a Spotify controller on my desktop that I'd actually enjoy looking at. Not another flat grey box, but something closer to Apple's liquid glass: clear, soft, a little bit alive. So I built one for Windows.

Glass Player is a small widget that floats on your desktop, shows what's playing, and gives you play/pause, previous/next, shuffle, seek and "always on top". It appears when Spotify opens and leaves when Spotify closes. It's written in C# with WPF on .NET 8, and it's open source.

MugheezAsif / glass-player

Glass Player

A liquid-glass mini player for Spotify on Windows. Late-night vinyl, under glass: a tiny desktop widget that takes its colour from whatever you're listening to.

Highlights

Real frosted glass. The widget blurs whatever sits behind it with its own blur engine: clean 30 px corners, a thick bright rim, a soft lens ring and a faint pink/cyan refraction fringe.
The cover sets the mood. One accent colour is pulled from each album cover and carried through the play button, progress line, glow and dots. Every song re-themes the card.
A record that plays. A vinyl disc (the cover is its label) slides out of the sleeve and spins while music plays, and tucks back in when you pause.
Considered typography. Editorial serif for the title, a DIN face for the artist, editor-mono numerals for time.
Orchestrated motion. One staggered entrance (sleeve, record, titles, progress line, controls) instead of…

View on GitHub

The design: late-night vinyl, under glass

I gave myself one rule: the card is glass and white, and the album decides the only loud colour.

Playing	Paused	Shuffle on

Colour from the cover. The widget finds the most vivid pixel of the album art, pushes it into a usable range of saturation and brightness, and uses it for the play button, the progress line, the glow and the little dots. Every song re-themes the whole card. Grey covers fall back to a warm paper white.
Type with character. The title is set in Sitka Banner, a high-contrast editorial serif. The artist is in Bahnschrift, a DIN face. The time and the NOW PLAYING label are in Cascadia Mono. All three ship with Windows, so there's nothing to install.
A record that plays. Behind the cover sits a vinyl disc, with the cover art as its label. When music plays it slides out of the sleeve with a small overshoot and starts spinning. Pause, and it tucks back in.
One entrance, not ten. When the widget appears, everything arrives in a staggered sequence: sleeve, record, titles, progress line, then the buttons. One orchestrated moment feels better than lots of random micro-animations.

The hard parts

The look was the fun part. Making it work on Windows was where I learned the most.

1. Talking to Spotify without the Spotify API

I didn't want OAuth, API keys or a Premium requirement. Windows already knows what's playing: the same system media controls you see when you press a volume key. In .NET that's GlobalSystemMediaTransportControlsSessionManager:

var manager = await GlobalSystemMediaTransportControlsSessionManager.RequestAsync();
var spotify = manager.GetSessions()
    .FirstOrDefault(s => s.SourceAppUserModelId.Contains("spotify", StringComparison.OrdinalIgnoreCase));

var info = await spotify.TryGetMediaPropertiesAsync();   // title, artist, cover thumbnail
await spotify.TryTogglePlayPauseAsync();                 // controls

You get the title, artist, cover, play state, shuffle and the timeline, plus controls, with no login at all.

2. The grey box behind the rounded corners

My first glass version used Windows' built-in "blur behind" effect. It looked great, except for a grey square peeking out of every rounded corner. Windows blurs the window's whole rectangle and ignores its rounded shape. I tried three different APIs and none of them respected the curve.

So I wrote my own glass. The trick is one call:

SetWindowDisplayAffinity(hwnd, WDA_EXCLUDEFROMCAPTURE);

This hides the window from screen capture, and that includes captures made by the app itself. So the widget can grab the part of the screen directly behind itself. It shrinks that to a third of the size, runs a three-pass box blur (which looks almost exactly like a Gaussian blur), boosts the colour a little, and draws it inside a properly anti-aliased rounded card with its own soft shadow. A quick hash skips all the work when nothing behind it has changed.

The trade-off: the widget doesn't show up in screenshots or screen shares. That's also why the images in this post come from a "showcase mode" I added. The app renders itself over generated wallpapers, with made-up tracks and generated cover art.

3. "It doesn't look HD"

At one point the widget looked soft, and it took some digging to find out why. Three things were going on:

The whole layout scales with the window size, which puts lines and images on half-pixels.
Some layers were cached as bitmaps and then stretched.
The text had a drop-shadow effect on it, which slightly blurs the letters themselves.

The fixes: the 1-pixel glass edges and the cover art are now drawn outside the scaled layout, snapped to whole pixels. The text shadow is a separate blurred copy sitting behind sharp text. The difference is obvious side by side.

4. Keeping a spinning record cheap

A transparent window like this has to re-upload its whole image every time anything moves, so a spinning record could quietly eat CPU. The answers were:

Bake every static layer (the glass, the edges, the cover, the buttons) into a cached image.
Avoid live effects on anything that updates often.
Spin at 15 fps. The grooves are circular, so it still reads as smooth.

While the record spins it uses roughly 5–10% of one CPU core, which is well under 1% of a modern multi-core CPU. And if you'd rather it sat perfectly still, the spin can be switched off from the tray.

What I learned

Constraints make the design. "One accent colour, taken from the cover" did more for the look than any extra effect.
Know when to stop fighting the platform. I tried three ways to make Windows' blur respect rounded corners. Writing my own blur took less time than that, and it does exactly what I need.
Measure before optimising. I was sure the spinning record was the expensive part. A quick profile showed it was a glow effect being redrawn four times a second.

Try it

It's on GitHub with build steps, a full write-up of the design and engineering, and an MIT license:

MugheezAsif / glass-player

Glass Player

A liquid-glass mini player for Spotify on Windows. Late-night vinyl, under glass: a tiny desktop widget that takes its colour from whatever you're listening to.

Highlights

Real frosted glass. The widget blurs whatever sits behind it with its own blur engine: clean 30 px corners, a thick bright rim, a soft lens ring and a faint pink/cyan refraction fringe.
The cover sets the mood. One accent colour is pulled from each album cover and carried through the play button, progress line, glow and dots. Every song re-themes the card.
A record that plays. A vinyl disc (the cover is its label) slides out of the sleeve and spins while music plays, and tucks back in when you pause.
Considered typography. Editorial serif for the title, a DIN face for the artist, editor-mono numerals for time.
Orchestrated motion. One staggered entrance (sleeve, record, titles, progress line, controls) instead of…

View on GitHub

If you build it, I'd love to see a screenshot of it over your wallpaper. And I'm curious: what would you add to a desktop music widget? Lyrics, a mini visualiser, keyboard shortcuts? Let me know in the comments. 👇

DEV Community: Mugheez Asif

I built a liquid-glass Spotify mini player for Windows

MugheezAsif / glass-player

Glass Player

Highlights

The design: late-night vinyl, under glass

The hard parts

1. Talking to Spotify without the Spotify API

2. The grey box behind the rounded corners

3. "It doesn't look HD"

4. Keeping a spinning record cheap

What I learned

Try it

MugheezAsif / glass-player

Glass Player

Highlights