Music Display
A cross-platform now-playing widget for macOS and Windows that detects media from any app or website and keeps playback, seek, loop, and volume controls close at hand.
Project narrative
One control surface for every media source
Music Display is a compact desktop widget for macOS and Windows. It surfaces the media session already playing on the computer—Spotify, Apple Music, YouTube Music in a browser, and other system-integrated sources—inside a frameless HUD that stays close without taking over the desktop.
Controls that stay within reach
- Live title, artist, and album artwork
- Play/pause, previous, next, and draggable timeline seeking
- App-enforced looping, including sources that ignore the system repeat command
- System volume control
- Keyboard seeking and playback shortcuts
- 80%–160% interface scaling
- Always-on-top, run-on-startup, and remembered window position
Cross-platform media detection
The main Electron process uses a platform-specific media bridge rather than a service-specific API.
- macOS: the
media-controlCLI reads and controls the active system media session, including newer macOS versions where direct MediaRemote access is restricted. - Windows: bundled PowerShell helpers connect to WinRT
GlobalSystemMediaTransportControlsSessionManagerfor media metadata and transport controls.
A secure preload context bridge exposes only the required controls to the React renderer, while electron-store persists preferences.
Packaging and delivery
The interface is built with React and TypeScript through electron-vite. electron-builder produces an ARM64 macOS DMG/ZIP and a Windows NSIS installer. GitHub Actions builds both platforms and publishes tagged releases.
Version 1.0.2 is available for macOS and Windows.
Next project
Web applicationUp next
Spelling Bee
Simple web-based game for typing words after listening what word has been herd.