diff --git a/public/js/index.js b/public/js/index.js
index eb38b58..ad16c65 100644
--- a/public/js/index.js
+++ b/public/js/index.js
@@ -167,14 +167,11 @@ function buildActivityHTML(activity) {
 			: "";
 
 	const activityButtons =
-		activity.buttons && activity.buttons.length > 0
+		(activity.buttons && activity.buttons.length > 0
 			? `<div class="activity-buttons">
 					${activity.buttons
 						.map((button, index) => {
-							const label =
-								typeof button === "string"
-									? button
-									: button.label;
+							const label = typeof button === "string" ? button : button.label;
 							let url = null;
 							if (typeof button === "object" && button.url) {
 								url = button.url;
@@ -188,7 +185,12 @@ function buildActivityHTML(activity) {
 						.filter(Boolean)
 						.join("")}
 				</div>`
-			: "";
+			: "") +
+		(activity.name === "Spotify" && activity.sync_id
+			? `<div class="activity-buttons">
+					<a href="https://open.spotify.com/track/${activity.sync_id}" class="activity-button" target="_blank" rel="noopener noreferrer">Listen on Spotify</a>
+			   </div>`
+			: "");
 
 	const progressBar =
 		progress !== null
@@ -321,9 +323,7 @@ async function populateReadme(data) {
 	if (readmeSection && data.kv?.readme) {
 		const url = data.kv.readme;
 		try {
-			const res = await fetch(
-				`/api/readme?url=${encodeURIComponent(url)}`,
-			);
+			const res = await fetch(`/api/readme?url=${encodeURIComponent(url)}`);
 			if (!res.ok) throw new Error("Failed to fetch readme");
 
 			const text = await res.text();
@@ -343,9 +343,7 @@ async function updatePresence(data) {
 	const cssLink = data.kv?.css;
 	if (cssLink) {
 		try {
-			const res = await fetch(
-				`/api/css?url=${encodeURIComponent(cssLink)}`,
-			);
+			const res = await fetch(`/api/css?url=${encodeURIComponent(cssLink)}`);
 			if (!res.ok) throw new Error("Failed to fetch CSS");
 
 			const cssText = await res.text();