See synchronized Spotify lyrics inside VS Code while coding.
✨ Features
📌 Live lyrics sync with your Spotify playback.
with your Spotify playback. 🎨 Lyrics colors auto-themed from album cover (via colorthief ).
). 🖥️ Smooth side panel view – code on the left, lyrics on the right.
– code on the left, lyrics on the right. 🔑 Simple one-time login using your own Spotify Client ID.
using your own Spotify Client ID. 🚪 Quick logout command to reset session.
📸 Demo
⚡️ Installation
Open VS Code → Extensions → search spotilyrics or install from VS Code Marketplace. Run the command:
Show Spotify Lyrics via Spotilyrics
🔑 Authentication (one-time setup)
Go to Spotify Developer Dashboard. Create an app → copy Client ID. Important: set the Redirect URI for your app to: http://127.0.0.1:8000/callback Run the Show Spotify Lyrics via Spotilyrics command. Paste your Client ID in the panel and log in. Enjoy synced lyrics while coding! 🎶
ℹ️ Why? – To respect Spotify API rate limits, you need your own ID.
⌨️ Commands
Show Spotify Lyrics via Spotilyrics ( spotilyrics.lyrics ) – open synced lyrics panel.
( ) – open synced lyrics panel. Logout from Spotilyrics ( spotilyrics.logout ) – clear session and re-auth when needed.
⚙️ Tech stack
Spotify Web API
LRClib for lyrics with timing
colorthief for cover-based theme
TypeScript + VS Code WebView
📜 License
This project is licensed as Unlicensed.
Feel free to use, hack, and remix it – but no warranties 😉