diff --git a/web_server.py b/web_server.py
index cda4fb23..7f022605 100644
--- a/web_server.py
+++ b/web_server.py
@@ -12753,6 +12753,15 @@ def merge_discography_data(owned_releases, spotify_discography):
                     if not owned_release.get('image_url') and spotify_release.get('image_url'):
                         owned_release['image_url'] = spotify_release['image_url']
 
+                    # Release date priority: Spotify first (more reliable), then owned fallback
+                    if spotify_release.get('release_date'):
+                        owned_release['release_date'] = spotify_release['release_date']
+                    elif spotify_release.get('year'):
+                        owned_release['release_date'] = f"{spotify_release['year']}-01-01"
+                    elif owned_release.get('year'):
+                        # Convert year to release_date format if needed
+                        owned_release['release_date'] = f"{owned_release['year']}-01-01"
+
                     cards.append(owned_release)
 
                     # Enhanced logging with track completion
diff --git a/webui/static/script.js b/webui/static/script.js
index b1bc6973..5fcdb278 100644
--- a/webui/static/script.js
+++ b/webui/static/script.js
@@ -14688,10 +14688,49 @@ function createReleaseCard(release) {
     title.textContent = release.title;
     title.title = release.title;
 
-    // Create year
+    // Create year - extract from release_date (Spotify format) or fall back to year field
     const year = document.createElement("div");
     year.className = "release-year";
-    year.textContent = release.year || "Unknown Year";
+
+    let yearText = "Unknown Year";
+
+    // DEBUG: Log the release data to see what we're working with (remove this after testing)
+    // console.log(`🔍 DEBUG: Release "${release.title}" data:`, {
+    //     title: release.title,
+    //     owned: release.owned,
+    //     year: release.year,
+    //     release_date: release.release_date,
+    //     track_completion: release.track_completion
+    // });
+
+    // First try to extract year from release_date (Spotify format: "YYYY-MM-DD")
+    if (release.release_date) {
+        try {
+            // Extract year directly from string to avoid timezone issues
+            const yearMatch = release.release_date.match(/^(\d{4})/);
+            if (yearMatch) {
+                const releaseYear = parseInt(yearMatch[1]);
+                if (releaseYear && !isNaN(releaseYear) && releaseYear > 1900 && releaseYear <= new Date().getFullYear() + 1) {
+                    yearText = releaseYear.toString();
+                }
+            } else {
+                // Fallback to Date parsing if format is different
+                const releaseYear = new Date(release.release_date).getFullYear();
+                if (releaseYear && !isNaN(releaseYear) && releaseYear > 1900 && releaseYear <= new Date().getFullYear() + 1) {
+                    yearText = releaseYear.toString();
+                }
+            }
+        } catch (e) {
+            console.warn('Error parsing release_date:', release.release_date, e);
+        }
+    }
+
+    // Fallback to direct year field if release_date parsing failed
+    if (yearText === "Unknown Year" && release.year) {
+        yearText = release.year.toString();
+    }
+
+    year.textContent = yearText;
 
     // Create completion info
     const completion = document.createElement("div");