ProfileCrest Developer Blog — Tutorials & Guides
DYNAMIC INTEGRATIONS August 10, 2026 8 min read CodeCrest Engineering Team

How to Add Live Spotify & Discord Status to Your GitHub Profile README

Adding real-time media playback and online presence to your GitHub profile turns a static README into a dynamic live dashboard. Learn how to display your currently playing Spotify songs and Discord activity using Lanyard API and SVG cards.

Why Add Live Presence to Your Profile?

Developers spend long hours listening to music while coding and hanging out in developer Discord communities. Showing what music you are listening to in real time adds a human touch to your profile, sparking natural conversations with recruiters, team members, and open-source collaborators.

With modern open-source services like Lanyard API and custom Vercel SVG endpoints, you can render live Discord presence (Online, Idle, DND, Offline), custom status messages, and Spotify track info directly inside your GitHub Markdown without maintaining your own backend server.

What is Lanyard API?

Lanyard is a service created by Phineas that exposes your Discord presence (including Rich Presence like Spotify, VS Code status, and custom games) via a REST API and WebSocket connection. By joining the Lanyard Discord server, Lanyard listens to your Discord presence and exposes an SVG endpoint that can be embedded directly into Markdown.

Step 1: Connect Your Account to Lanyard

  1. Join the official Lanyard Discord server (find the invite at discord.gg/lanyard).
  2. Once joined, Lanyard will automatically start monitoring your Discord presence — no bot commands or authentication tokens required.
  3. Copy your Discord User ID (Enable Developer Mode in Discord settings, right-click your profile picture, and select Copy User ID).

Step 2: Embed the Live Spotify & Discord Card

Use the following Markdown image tag in your profile README, replacing YOUR_DISCORD_ID with your numeric ID:

[![Spotify & Discord Status](https://lanyard.cnrad.dev/api/YOUR_DISCORD_ID)](https://spotify.com)

Customizing Themes & Options

You can customize the card appearance using URL query parameters:

  • ?theme=dark — Set dark theme background matching dark GitHub interface.
  • ?bg=00000000 — Make card background transparent for seamless Bento grid embedding.
  • ?borderRadius=12px — Customize corner radius to match your Bento grid cards.
  • ?hideDiscrim=true — Hide legacy Discord tag numbers.

Automating with ProfileCrest

In ProfileCrest, you don't need to remember URL parameters. Simply navigate to the Widgets & Addons step, toggle Live Spotify & Discord Status, paste your Discord User ID, and choose your preferred card style. ProfileCrest will format the card and integrate it directly into your chosen layout.

Add Live Spotify & Discord Widgets Instantly

ProfileCrest lets you add live presence widgets with custom themes in a single click.

🚀 Open ProfileCrest Generator
All ArticlesNext: Contribution Snake Guide