Listen to Spotify without ever leaving your editor.
PitchBlack is a VS Code extension that brings a full Spotify music player directly into your sidebar! Browse playlists, play songs, and control playback without breaking your flow.
Browse all your Spotify playlists directly from the VS Code sidebar. Each playlist displays its cover art and name for easy identification.
Click any playlist to see its full track list with album art and song names.
(Due to Spotify API restrictions, songs are limited to 50 per playlist)
A cinematic now playing screen with:
- Album artwork
- Song title (links to Spotify)
- Artist name (links to Spotify)
- Previous, play/pause, and skip controls
- Volume slider
- Spotify attribution
PitchBlack automatically switches to a compact row layout when the sidebar is small, so it never gets in the way of your work.
Log in once and PitchBlack remembers your session, no re-authentication needed every time you open VS Code.
- Spotify Premium — Required for playback control via the Spotify API
- An active Spotify session on any device (desktop app, web player, or mobile) before starting playback
- Install PitchBlack from the VS Code Marketplace
- Open the PitchBlack panel in the Explorer sidebar
- Log in with your Spotify account when prompted
- Browse your playlists and start listening!
PitchBlack does not contribute any VS Code settings at this time.
- Active device required — Spotify must be open and active on a device before PitchBlack can control playback. If no active device is found, open Spotify on any device and try again.
- Skip controls — Skip previous may be restricted by Spotify depending on your account type or current playback context.
Initial release of PitchBlack.
- Spotify OAuth authentication with session persistence
- Playlist and song list browsing
- Full playback controls (play, pause, skip, volume)
- Responsive compact layout
- Spotify policy compliant with attribution and deep links
Here's what's coming in future updates:
- Search — Search for any song, artist, or album directly from the sidebar without needing to browse playlists
- Like/Save tracks — Like a song from the now playing view and have it saved to your Liked Songs on Spotify
- Queue view — See what's coming up next in your playback queue
- Shuffle & repeat — Toggle shuffle and repeat modes from within PitchBlack
- Album view — Browse songs by album, not just by playlist
- Podcast support — Browse and play your Spotify podcasts with seek controls
- Now playing notifications — Get a VS Code notification when a new song starts
- Custom themes — Choose from different color themes for the player UI
Since PitchBlack requires your own Spotify API credentials to run, follow these steps to get it working:
git clone https://github.com/yourusername/pitchblack.git
cd pitchblacknpm install- Go to the Spotify Developer Dashboard
- Log in with your Spotify account
- Click Create App
- Fill in the app name and description
- Add
http://127.0.0.1:8080/callbackas a Redirect URI - Select Web API and Web Playback SDK under APIs used
- Click Save
- Copy your Client ID and Client Secret from the app dashboard
In the root of the project, create a file called .env and add your credentials:
SPOTIFY_CLIENT_ID=your_client_id_here
SPOTIFY_CLIENT_SECRET=your_client_secret_here
Never commit your
.envfile — it is already included in.gitignore
Open the project in VS Code and press F5 to launch the extension in a new Extension Development Host window. PitchBlack will appear in the Explorer sidebar.
PitchBlack uses the Spotify Web API and Spotify Web Playback SDK. All music content and metadata is provided by Spotify.