All projects
Next.jsTypeScriptnpm PackageHowler.jsFramer Motion

srt-lyric-player

Built a Spotify-style music player with real-time synchronized lyrics driven by standard .srt subtitle files, and published the result as the srt-lyric-player npm package. Engineered real-time lyric sync using Howler.js for audio playback, Framer Motion for lyric transition animations, and Web Audio API for a canvas-based audio visualizer. Structured as a Next.js 15 monorepo with the package bundled via tsup (ESM + CJS + TypeScript types) and deployed live on Vercel as an interactive demo.

srt-lyric-player — screenshot 1
srt-lyric-player — screenshot 2
srt-lyric-player — screenshot 3
srt-lyric-player — screenshot 4
srt-lyric-player — screenshot 5
srt-lyric-player — screenshot 6