diff --git a/.gitignore b/.gitignore
index e7d733d..6f9b8e5 100644
--- a/.gitignore
+++ b/.gitignore
@@ -5,3 +5,4 @@ data
 fetch-and-convert.sh
 deploy.sh
 hugo.toml
+content/playlists
diff --git a/generate-playlist-pages.sh b/generate-playlist-pages.sh
new file mode 100755
index 0000000..affb3f1
--- /dev/null
+++ b/generate-playlist-pages.sh
@@ -0,0 +1,67 @@
+#!/bin/bash
+
+# ============================================
+# Generate Hugo Playlist Pages from JSON
+# ============================================
+
+DATA_FILE="data/playlists/playlists.json"
+CONTENT_DIR="content/playlists"
+
+# Check if data file exists
+if [ ! -f "$DATA_FILE" ]; then
+    echo "❌ Error: $DATA_FILE not found. Run fetch-playlist.sh first."
+    exit 1
+fi
+
+# Create content directory
+mkdir -p "$CONTENT_DIR"
+
+# Create _index.md if it doesn't exist
+if [ ! -f "$CONTENT_DIR/_index.md" ]; then
+    cat > "$CONTENT_DIR/_index.md" << 'EOF'
+---
+title: "Playlists"
+---
+EOF
+fi
+
+# Clear old playlist pages (keep _index.md)
+find "$CONTENT_DIR" -maxdepth 1 -type f -name "*.md" ! -name "_index.md" -delete
+
+# Process each playlist
+cat "$DATA_FILE" | jq -c '.playlists[]' | while read -r playlist; do
+    NAME=$(echo "$playlist" | jq -r '.name // "Untitled Playlist"')
+    SLUG=$(echo "$NAME" | tr ' ' '-' | tr '[:upper:]' '[:lower:]' | sed 's/[^a-z0-9-]//g' | sed 's/--*/-/g' | sed 's/^-//;s/-$//')
+    
+    # If slug is empty, use the ID
+    if [ -z "$SLUG" ] || [ "$SLUG" = "untitled-playlist" ]; then
+        SLUG=$(echo "$playlist" | jq -r '.id' | head -c 12)
+    fi
+    
+    DESCRIPTION=$(echo "$playlist" | jq -r '.description // ""')
+    IMAGE=$(echo "$playlist" | jq -r '.image // ""')
+    TRACKS=$(echo "$playlist" | jq -c '.tracks')
+    PLAYLIST_ID=$(echo "$playlist" | jq -r '.id')
+    CREATED_AT=$(echo "$playlist" | jq -r '.created_at')
+    
+    # Convert created_at to date
+    CREATED_DATE=$(date -d "@$CREATED_AT" "+%Y-%m-%d" 2>/dev/null || echo $(date "+%Y-%m-%d"))
+    
+    cat > "$CONTENT_DIR/$SLUG.md" <<EOF
+---
+title: "$NAME"
+date: $CREATED_DATE
+draft: false
+playlist_id: "$PLAYLIST_ID"
+playlist_description: "$DESCRIPTION"
+playlist_image: "$IMAGE"
+playlist_tracks: $TRACKS
+playlist_created_at: $CREATED_AT
+---
+EOF
+    
+    echo "✅ Generated: $CONTENT_DIR/$SLUG.md"
+done
+
+echo ""
+echo "📊 Generated $(find "$CONTENT_DIR" -maxdepth 1 -type f -name "*.md" ! -name "_index.md" | wc -l) playlist pages"
\ No newline at end of file
diff --git a/themes/one-pager/layouts/playlists/list.html b/themes/one-pager/layouts/playlists/list.html
new file mode 100644
index 0000000..5394a76
--- /dev/null
+++ b/themes/one-pager/layouts/playlists/list.html
@@ -0,0 +1,37 @@
+{{ define "main" }}
+<section class="section playlists-list">
+    <h1>Playlists</h1>
+    <p class="section-description">Explore all my curated playlists from the Nostr network</p>
+    
+    <div class="playlists-grid">
+        {{ range .Pages }}
+        {{ $name := .Title }}
+        {{ $description := .Params.playlist_description | default "" }}
+        {{ $image := .Params.playlist_image | default "" }}
+        {{ $tracks := .Params.playlist_tracks | default slice }}
+        
+        <div class="playlist-card">
+            <a href="{{ .RelPermalink }}" class="playlist-link">
+                {{ if $image }}
+                <img src="{{ $image }}" alt="{{ $name }}" class="playlist-image" loading="lazy">
+                {{ end }}
+                
+                <div class="playlist-info">
+                    <h2>{{ $name }}</h2>
+                    {{ if $description }}
+                    <p class="playlist-description">{{ $description }}</p>
+                    {{ end }}
+                    {{ if $tracks }}
+                    <span class="playlist-track-count">{{ len $tracks }} tracks</span>
+                    {{ end }}
+                </div>
+                
+                <div class="playlist-hover-overlay">
+                    <span class="playlist-view-btn">▶ View Playlist</span>
+                </div>
+            </a>
+        </div>
+        {{ end }}
+    </div>
+</section>
+{{ end }}
\ No newline at end of file
diff --git a/themes/one-pager/layouts/playlists/single.html b/themes/one-pager/layouts/playlists/single.html
new file mode 100644
index 0000000..9c2a107
--- /dev/null
+++ b/themes/one-pager/layouts/playlists/single.html
@@ -0,0 +1,137 @@
+{{ define "main" }}
+{{ $name := .Title }}
+{{ $description := .Params.playlist_description | default "" }}
+{{ $image := .Params.playlist_image | default "" }}
+{{ $tracks := .Params.playlist_tracks | default slice }}
+{{ $created_at := .Params.playlist_created_at | default 0 }}
+
+<section class="section playlist-detail">
+    <div class="playlist-header">
+        <div class="playlist-header-content">
+            {{ if $image }}
+            <img src="{{ $image }}" alt="{{ $name }}" class="playlist-header-image" loading="lazy">
+            {{ end }}
+            <div class="playlist-header-info">
+                <h1>{{ $name }}</h1>
+                {{ if $description }}
+                <p class="playlist-description">{{ $description }}</p>
+                {{ end }}
+                <div class="playlist-meta">
+                    <span class="playlist-track-count">🎵 {{ len $tracks }} tracks</span>
+                    {{ if $created_at }}
+                    <span class="playlist-created">📅 {{ dateFormat "January 2, 2006" (time $created_at) }}</span>
+                    {{ end }}
+                </div>
+            </div>
+        </div>
+    </div>
+    
+    <div class="playlist-tracks-list">
+        {{ if $tracks }}
+            {{ range $index, $track := $tracks }}
+            <div class="playlist-track-item">
+                <div class="track-number">{{ add $index 1 }}</div>
+                {{ if $track.image }}
+                <img src="{{ $track.image }}" alt="{{ $track.title }}" class="track-thumbnail" loading="lazy">
+                {{ end }}
+                <div class="track-info">
+                    <span class="track-title">{{ $track.title | default "Untitled" }}</span>
+                    <span class="track-artist">{{ $track.artist | default "Unknown Artist" }}</span>
+                    {{ if $track.album }}
+                    <span class="track-album">{{ $track.album }}</span>
+                    {{ end }}
+                    {{ if $track.duration }}
+                    <span class="track-duration">{{ $track.duration }}s</span>
+                    {{ end }}
+                    {{ if $track.tags }}
+                    <div class="track-tags">
+                        {{ range $track.tags }}
+                        <span class="tag"><span>{{ . }}</span></span>
+                        {{ end }}
+                    </div>
+                    {{ end }}
+                </div>
+                <div class="track-player-wrapper">
+                    {{ if $track.url }}
+                    <audio controls preload="none" class="track-player">
+                        <source src="{{ $track.url }}" type="audio/mpeg">
+                    </audio>
+                    {{ end }}
+                    {{ if $track.id }}
+                    <button class="track-share-btn" onclick="copyTrackLink('{{ $track.id }}')" title="Share this track">
+                        <span>🔗</span>
+                    </button>
+                    {{ end }}
+                </div>
+            </div>
+            {{ end }}
+        {{ else }}
+            <p class="no-tracks">No tracks found for this playlist.</p>
+        {{ end }}
+    </div>
+    
+    {{ if $tracks }}
+    <div class="playlist-actions">
+        <button class="playlist-play-all" onclick="playAllTracks()">
+            <span>▶</span> Play All Tracks
+        </button>
+    </div>
+    {{ end }}
+    
+    <div class="playlist-back">
+        <a href="/playlists/" class="back-link">← Back to All Playlists</a>
+    </div>
+</section>
+
+<script>
+function copyTrackLink(trackId) {
+    const url = `https://nostr.basspistol.org/notes/${trackId}`;
+    if (navigator.clipboard) {
+        navigator.clipboard.writeText(url).then(() => {
+            const btn = event.target.closest('.track-share-btn');
+            const originalText = btn.innerHTML;
+            btn.innerHTML = '✓';
+            setTimeout(() => {
+                btn.innerHTML = originalText;
+            }, 2000);
+        }).catch(() => {
+            fallbackCopy(url);
+        });
+    } else {
+        fallbackCopy(url);
+    }
+}
+
+function fallbackCopy(url) {
+    const textArea = document.createElement('textarea');
+    textArea.value = url;
+    document.body.appendChild(textArea);
+    textArea.select();
+    document.execCommand('copy');
+    document.body.removeChild(textArea);
+    const btn = event.target.closest('.track-share-btn');
+    const originalText = btn.innerHTML;
+    btn.innerHTML = '✓';
+    setTimeout(() => {
+        btn.innerHTML = originalText;
+    }, 2000);
+}
+
+function playAllTracks() {
+    const players = document.querySelectorAll('.track-player');
+    if (players.length === 0) return;
+    
+    let current = 0;
+    function playNext() {
+        if (current >= players.length) return;
+        const player = players[current];
+        player.play();
+        player.onended = function() {
+            current++;
+            playNext();
+        };
+    }
+    playNext();
+}
+</script>
+{{ end }}
\ No newline at end of file