Introduction
Mineradio is an open-source immersive music player that transforms audio playback into a visual experience. It combines cinematic camera movements, particle-based visuals, and synchronized lyric stages to create a concert-like atmosphere in your browser, making it a creative showcase for web audio and WebGL technologies.
What Mineradio Does
- Plays music with real-time audio visualization driven by frequency analysis
- Renders cinematic camera effects that respond to beat and rhythm
- Displays synchronized lyrics on a virtual stage with animated typography
- Generates particle systems and visual effects tied to audio energy levels
- Supports custom playlists and configurable visual themes
Architecture Overview
Mineradio is built as a single-page HTML/JS application using the Web Audio API for frequency analysis and Canvas/WebGL for rendering. The audio analyzer extracts frequency bins in real time, feeding them to a visual pipeline that drives camera motion, particle emission rates, and lyric animation timing. The lyric synchronization engine uses LRC-format timestamps to coordinate text display with the audio track.
Self-Hosting & Configuration
- Clone the repository and serve the directory with any static file server
- Add music files and LRC lyrics to the configured media directory
- Customize visual themes by editing the shader and particle configuration files
- No build step required — runs directly in modern browsers
- Deploy to any static hosting service (Netlify, Vercel, GitHub Pages)
Key Features
- Real-time audio-reactive visuals with WebGL particle systems
- Cinematic camera system with smooth transitions tied to musical structure
- LRC lyric synchronization with animated typography effects
- Configurable visual themes for different musical genres
- Fully client-side with no server dependencies
Comparison with Similar Tools
- Spotify — streaming service with basic visualizers; Mineradio offers deep visual customization
- MilkDrop/Butterchurn — classic Winamp visualizer; Mineradio adds lyric integration and cinematic cameras
- Wavesurfer.js — audio waveform library; Mineradio is a complete player experience, not a component
- Three.js audio examples — demo-level projects; Mineradio is a polished, playlist-capable player
- Navidrome — self-hosted music server; Mineradio focuses on the playback and visual experience
FAQ
Q: What browsers are supported? A: Any modern browser with Web Audio API and WebGL support (Chrome, Firefox, Edge, Safari).
Q: Can I use my own music library? A: Yes, add audio files and optional LRC lyric files to the media directory for a personalized experience.
Q: Does Mineradio support streaming from external sources? A: It is primarily designed for local files, but you can point it at any URL-accessible audio source.
Q: How demanding is it on hardware? A: The particle and WebGL effects run smoothly on most modern devices. You can reduce visual complexity in the config for lower-end hardware.