spotilyrics

See synchronized Spotify lyrics inside VS Code while coding.

✨ Features

• 📌 Live lyrics sync 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.
• 🔑 Simple one-time login using your own Spotify Client ID.
• 🚪 Quick logout command to reset session.

📸 Demo

⚡️ Installation

1. Open VS Code → Extensions → search Spotilyrics.

2. Run the command:

Show Spotify Lyrics via Spotilyrics

🔑 Authentication (one-time setup)

1. Go to Spotify Developer Dashboard.
2. Create an app → copy Client ID.
3. Important: set the Redirect URI for your app to: http://127.0.0.1:8000/callback
4. Run the Show Spotify Lyrics via Spotilyrics command.
5. Paste your Client ID in the panel and log in.
6. 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.
• 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 😉