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 π