Inspired by Spotify's immersive now-playing experience. A frosted glass card with dynamic color-extracted gradient background, compact playback controls, and a slim progress bar. Perfect for music, podcast, and media-rich content platforms.
Export Snippets
Switch formats without compressing the preview layout.
AI Prompt
Natural-language design direction for AI coding tools.
Create a Spotify-inspired now-playing card. The container is a rounded-2xl frosted glass surface (#132626B3) with backdrop-blur-2xl and a thin border (#ECFDF51A). Behind the card, render 2 blurred radial gradients at 35% opacity extracted from album art colors (position at 20% 30% and 80% 70%). Inside the card: a 56x56 rounded-xl album art thumbnail on the left with a subtle ring shadow (0 0 0 1px #ECFDF514), a vertical stack of track title (#ECFDF5, 15px, font-weight 600, letter-spacing -0.01em) and artist name (#6EE7B7, 13px), and minimal playback controls on the right (prev/play/next icons at 20px, #ECFDF5, play button slightly larger at 24px). Below the content, a 4px progress bar with rounded-full ends: bright green track (#059669) on a dark rail (#1F3D3D). On hover, lift the card with shadow (0 8px 32px #00000066) and brighten the border. This card conveys musical energy, immersive content, and premium quality.Inspired by Spotify's immersive now-playing experience. A frosted glass card with dynamic color-extracted gradient background, compact playback controls, and a slim progress bar. Perfect for music, podcast, and media-rich content platforms.