5c:I[333483,["/creators-assets/_next/static/immutable/chunks/16d0e6blr3zvd.js","/creators-assets/_next/static/immutable/chunks/3jpuro209qqra.js","/creators-assets/_next/static/immutable/chunks/2qlox892e2j_q.js","/creators-assets/_next/static/immutable/chunks/0c6romi9ma0is.js","/creators-assets/_next/static/immutable/chunks/1jubx4t_1hq7l.js","/creators-assets/_next/static/immutable/chunks/30hhj9fl_j_en.js","/creators-assets/_next/static/immutable/chunks/07e2f_v4-u-we.js","/creators-assets/_next/static/immutable/chunks/33adfll0sgxzj.js","/creators-assets/_next/static/immutable/chunks/2504rifrkrd_l.js","/creators-assets/_next/static/immutable/chunks/3orcs6a8eyfvz.js","/creators-assets/_next/static/immutable/chunks/19-jcjdymr-fa.js","/creators-assets/_next/static/immutable/chunks/39xjxvqtwa0x7.js","/creators-assets/_next/static/immutable/chunks/41zrh_r6fdtfq.js","/creators-assets/_next/static/immutable/chunks/120zfy8hqrcwf.js","/creators-assets/_next/static/immutable/chunks/19r4rf2zyng-y.js","/creators-assets/_next/static/immutable/chunks/3o3dwck1w1ue6.js","/creators-assets/_next/static/immutable/chunks/2c_4he4mvu2r0.js","/creators-assets/_next/static/immutable/chunks/3n0g19afc7srh.js","/creators-assets/_next/static/immutable/chunks/3q7g04e77g4lf.js","/creators-assets/_next/static/immutable/chunks/1u1uuj9mj0hoo.js","/creators-assets/_next/static/immutable/chunks/0lmnldnlzsgok.js","/creators-assets/_next/static/immutable/chunks/2iw_-bo8jogap.js","/creators-assets/_next/static/immutable/chunks/0z2hzm-7v_g2c.js","/creators-assets/_next/static/immutable/chunks/3o1z26bd2_9eh.js","/creators-assets/_next/static/immutable/chunks/2qeyp4zfa4qwb.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/2qrxli96_t9cq.js","/creators-assets/_next/static/immutable/chunks/27vyv0cqm_295.js","/creators-assets/_next/static/immutable/chunks/1_2vu9p6mra4j.js","/creators-assets/_next/static/immutable/chunks/37uei1iwbnu3m.js","/creators-assets/_next/static/immutable/chunks/05i2jce8amocn.js","/creators-assets/_next/static/immutable/chunks/2njnkxjf39nsf.js","/creators-assets/_next/static/immutable/chunks/3edl5e308nytq.js","/creators-assets/_next/static/immutable/chunks/17w9c6wazundy.js","/creators-assets/_next/static/immutable/chunks/3zq_69yv5l6lg.js","/creators-assets/_next/static/immutable/chunks/14pxn0b6e1dc9.js","/creators-assets/_next/static/immutable/chunks/44oc0x6k7mw-i.js","/creators-assets/_next/static/immutable/chunks/02ciyo_cdpkrz.js","/creators-assets/_next/static/immutable/chunks/2_qutx8yar-up.js","/creators-assets/_next/static/immutable/chunks/0p4vy6mn-x9zs.js"],"PostDetailCard"] 5e:I[539959,["/creators-assets/_next/static/immutable/chunks/16d0e6blr3zvd.js","/creators-assets/_next/static/immutable/chunks/3jpuro209qqra.js","/creators-assets/_next/static/immutable/chunks/2qlox892e2j_q.js","/creators-assets/_next/static/immutable/chunks/0c6romi9ma0is.js","/creators-assets/_next/static/immutable/chunks/1jubx4t_1hq7l.js","/creators-assets/_next/static/immutable/chunks/30hhj9fl_j_en.js","/creators-assets/_next/static/immutable/chunks/07e2f_v4-u-we.js","/creators-assets/_next/static/immutable/chunks/33adfll0sgxzj.js","/creators-assets/_next/static/immutable/chunks/2504rifrkrd_l.js","/creators-assets/_next/static/immutable/chunks/3orcs6a8eyfvz.js","/creators-assets/_next/static/immutable/chunks/19-jcjdymr-fa.js","/creators-assets/_next/static/immutable/chunks/39xjxvqtwa0x7.js","/creators-assets/_next/static/immutable/chunks/41zrh_r6fdtfq.js","/creators-assets/_next/static/immutable/chunks/120zfy8hqrcwf.js","/creators-assets/_next/static/immutable/chunks/19r4rf2zyng-y.js","/creators-assets/_next/static/immutable/chunks/3o3dwck1w1ue6.js","/creators-assets/_next/static/immutable/chunks/2c_4he4mvu2r0.js","/creators-assets/_next/static/immutable/chunks/3n0g19afc7srh.js","/creators-assets/_next/static/immutable/chunks/3q7g04e77g4lf.js","/creators-assets/_next/static/immutable/chunks/1u1uuj9mj0hoo.js","/creators-assets/_next/static/immutable/chunks/0lmnldnlzsgok.js","/creators-assets/_next/static/immutable/chunks/2iw_-bo8jogap.js","/creators-assets/_next/static/immutable/chunks/0z2hzm-7v_g2c.js","/creators-assets/_next/static/immutable/chunks/3o1z26bd2_9eh.js","/creators-assets/_next/static/immutable/chunks/2qeyp4zfa4qwb.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/2qrxli96_t9cq.js","/creators-assets/_next/static/immutable/chunks/27vyv0cqm_295.js","/creators-assets/_next/static/immutable/chunks/1_2vu9p6mra4j.js","/creators-assets/_next/static/immutable/chunks/37uei1iwbnu3m.js","/creators-assets/_next/static/immutable/chunks/05i2jce8amocn.js","/creators-assets/_next/static/immutable/chunks/2njnkxjf39nsf.js","/creators-assets/_next/static/immutable/chunks/3edl5e308nytq.js","/creators-assets/_next/static/immutable/chunks/17w9c6wazundy.js","/creators-assets/_next/static/immutable/chunks/3zq_69yv5l6lg.js","/creators-assets/_next/static/immutable/chunks/14pxn0b6e1dc9.js","/creators-assets/_next/static/immutable/chunks/44oc0x6k7mw-i.js","/creators-assets/_next/static/immutable/chunks/02ciyo_cdpkrz.js","/creators-assets/_next/static/immutable/chunks/2_qutx8yar-up.js","/creators-assets/_next/static/immutable/chunks/0p4vy6mn-x9zs.js"],"CommentSection"] 5d:T734,

Quick Start & API Setup

Instant Connection: This widget requires a Last.fm API Key and your Last.fm User ID (Username) to fetch your live music data.
Why User ID? Your User ID tells the widget exactly whose scrobbling history to track and display.
How to get your API Key (Free, takes 1 minute):
1. Go to last.fm/api/account/create
2. Fill in any Application Name and Description (e.g., "Framer Widget"), then submit.
3. Copy your generated API Key and paste it directly into the Framer properties panel.

Live Synchronization: Instantly updates your "Now Playing" status and track history with custom refresh intervals.
Immersive Backgrounds: Features fluid, animated mesh-gradients generated dynamically from the album art.
3 Versatile Layouts: Seamlessly switch between Grid (visual-heavy), List (detailed text), and Minimal (compact bar) to fit any section.
Smooth Interactions: Fully integrated with Framer Motion for responsive hover animations and elegant tooltips.
100% Canvas & SSR Ready: Fully optimized using useIsStaticRenderer for flawless performance in both the Framer Editor and production.

59:[["$","$L5c",null,{"post":{"id":"019e9be2-1fa7-7558-b8a9-aba96501cd11","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"ced5af96-b59f-478b-9913-0d164c141d42","name":"Pitaly 8","slug":"pitaly-8","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/ced5af96-b59f-478b-9913-0d164c141d42/bo39fon2","followed":false,"followsYou":false},"media":[],"resources":[{"id":"YjjXROdOD3uBKx2f2wyf","resolved":true,"title":"SpotifyWidget","body":"$5d","bodyJson":null,"introduction":"Live music on Framer. Beautiful, dynamic","slug":"spotifywidget","author":{"framerUserId":"ced5af96-b59f-478b-9913-0d164c141d42","name":"Pitaly 8","slug":"pitaly-8","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/ced5af96-b59f-478b-9913-0d164c141d42/bo39fon2","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/YjjXROdOD3uBKx2f2wyf/spotifywidget-OS4TcwpS0q9rzbECiXZLDOpk3RYKMO"}],"post":null,"createdAt":"2026-05-30T09:10:35.108Z","updatedAt":"2026-06-05T16:26:00.214Z","publishedAt":"2026-06-06T07:42:28.263Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":"https://framer.com/m/Spotify-gEvBVN.js@KB5MaBDBzG8tMIYI5KNj","previewUrl":"https://spotifytoframe.framer.website/","price":null,"paymentUrl":null,"workshop":false,"categories":[{"id":"e0c8f757-ccb9-407f-a749-5feaa4078c28","name":"Utilities","slug":"utilities"}],"lastSaveId":"KB5MaBDBzG8tMIYI5KNj"}}],"contests":[],"categories":[],"tags":[],"likes":{"count":8,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-06-06T07:42:28.263Z","updatedAt":"2026-06-06T07:42:28.263Z","reported":false}}],["$","$L5e",null,{"target":{"kind":"post","postId":"019e9be2-1fa7-7558-b8a9-aba96501cd11"},"postId":"019e9be2-1fa7-7558-b8a9-aba96501cd11","postAuthor":"$59:0:props:post:author","targetCommentId":"$undefined"}]]

Suggested for you