5d:I[333483,["/creators-assets/_next/static/immutable/chunks/356g_j0l71_46.js","/creators-assets/_next/static/immutable/chunks/15s1ft4k9lx-7.js","/creators-assets/_next/static/immutable/chunks/0x8sumr53pdkk.js","/creators-assets/_next/static/immutable/chunks/3pud1dqsw0-_7.js","/creators-assets/_next/static/immutable/chunks/1m75iqpnspynu.js","/creators-assets/_next/static/immutable/chunks/0c6romi9ma0is.js","/creators-assets/_next/static/immutable/chunks/3ohf-5_4hfjuq.js","/creators-assets/_next/static/immutable/chunks/2jjhfe7-w6y9a.js","/creators-assets/_next/static/immutable/chunks/325i2v5l4tnlq.js","/creators-assets/_next/static/immutable/chunks/0kisxyo3aw231.js","/creators-assets/_next/static/immutable/chunks/2b1mm8iiske-y.js","/creators-assets/_next/static/immutable/chunks/0i7m0zg6jfazw.js","/creators-assets/_next/static/immutable/chunks/3-hmotkz_bdv_.js","/creators-assets/_next/static/immutable/chunks/06bqtx1jsc1kz.js","/creators-assets/_next/static/immutable/chunks/3q5wansxm4vp6.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/3naniu4pnqfyw.js","/creators-assets/_next/static/immutable/chunks/2-y_r3u4wh2s3.js","/creators-assets/_next/static/immutable/chunks/456d4lcv9-syj.js","/creators-assets/_next/static/immutable/chunks/36-o7-3julke0.js","/creators-assets/_next/static/immutable/chunks/2xq6uu2rcdc2i.js","/creators-assets/_next/static/immutable/chunks/2y9gv91n8o3i9.js","/creators-assets/_next/static/immutable/chunks/41i4r4u9uolgz.js","/creators-assets/_next/static/immutable/chunks/02ciyo_cdpkrz.js","/creators-assets/_next/static/immutable/chunks/3e73rezw4k1a2.js","/creators-assets/_next/static/immutable/chunks/15q00pdqk0br3.js","/creators-assets/_next/static/immutable/chunks/293prjxu_wz0c.js","/creators-assets/_next/static/immutable/chunks/0l9v835j421-s.js","/creators-assets/_next/static/immutable/chunks/40oma2w708rd-.js","/creators-assets/_next/static/immutable/chunks/2x7-2b3jcc9x7.js","/creators-assets/_next/static/immutable/chunks/3_pg4jxj9aiiw.js","/creators-assets/_next/static/immutable/chunks/3k6sa9ujkqb5c.js","/creators-assets/_next/static/immutable/chunks/3l2h8slpbzxqo.js","/creators-assets/_next/static/immutable/chunks/2xgtw4s-tlhet.js","/creators-assets/_next/static/immutable/chunks/3b306xa-3tb7g.js","/creators-assets/_next/static/immutable/chunks/2fvzgkzqkig_w.js","/creators-assets/_next/static/immutable/chunks/3g6klxxyg4m8-.js","/creators-assets/_next/static/immutable/chunks/0qx5rzvbsd7bx.js","/creators-assets/_next/static/immutable/chunks/1cphzzg2t2qo2.js"],"PostDetailCard"] 5e:T9d0,

Video Story is a modern, interactive story viewer for Framer designed to showcase videos and images in an immersive, mobile-inspired storytelling experience. With autoplay, progress indicators, tap navigation, hold-to-pause interaction, sound controls, and smooth story transitions, it makes visual content feel engaging and effortless to browse.

HOW TO USE

Add Video Story to your Framer page
Add videos or images to each story
Add a title and optional time label
Add an individual Link to each story if needed
Customize playback, progress bars, card styling, icons, navigation, and backdrop
Choose autoplay, looping, muted playback, and image duration settings

KEY FEATURES

Video and image support for flexible visual storytelling
Individual Link on every story for connecting content to pages, projects, products, or CMS destinations
Autoplay and looping for continuous story playback
Progress indicators showing the current story and playback progress
Tap navigation for quickly moving between stories
Hold-to-pause interaction for a more natural story experience
Play and pause controls for manual playback control
Sound controls with mute and unmute interaction
Keyboard navigation using arrow keys and spacebar
Blurred or solid backdrop for a polished immersive presentation
Responsive card layout that adapts across different screen sizes
Customizable typography for titles and timestamps
Adjustable card ratio, radius, spacing, colors, and controls
Poster image support for videos and fallback visuals

WHY CUSTOMERS WILL LOVE IT

Video Story brings the familiar feel of modern social story interfaces into Framer while giving designers full control over the visual presentation. The focused card layout keeps attention on one piece of content at a time, while progress bars, autoplay, tap navigation, and playback controls make the experience intuitive.

5a:[["$","$L5d",null,{"post":{"id":"01a0ce2c-1cbb-7484-88fa-2681ddfa5f2a","title":null,"body":"

Video Story

","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Video Story"}]}]},"author":{"framerUserId":"38425120-6213-4b66-8b3c-e3e66d07ec64","name":"Interface Studio","slug":"interfacestudio","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/2199676/kD3QNNYGg-bGneREuqMDI2n3QFCDqegiFFxRtaNA","followed":false,"followsYou":false},"media":[],"resources":[{"id":"YoKnLh3T153MEA4PfhMG","resolved":true,"title":"Video Story","body":"$5e","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Video Story","marks":[{"type":"bold"}]},{"type":"text","text":" is a modern, interactive story viewer for Framer designed to showcase videos and images in an immersive, mobile-inspired storytelling experience. With autoplay, progress indicators, tap navigation, hold-to-pause interaction, sound controls, and smooth story transitions, it makes visual content feel engaging and effortless to browse."}]},{"type":"customHeading","content":[{"type":"text","text":"HOW TO USE"}],"attrs":{"level":1}},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Add "},{"type":"text","text":"Video Story","marks":[{"type":"bold"}]},{"type":"text","text":" to your Framer page"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Add videos or images to each story"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Add a title and optional time label"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Add an individual "},{"type":"text","text":"Link","marks":[{"type":"bold"}]},{"type":"text","text":" to each story if needed"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Customize playback, progress bars, card styling, icons, navigation, and backdrop"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Choose autoplay, looping, muted playback, and image duration settings"}]}]}]},{"type":"customHeading","content":[{"type":"text","text":"KEY FEATURES"}],"attrs":{"level":1}},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Video and image support","marks":[{"type":"bold"}]},{"type":"text","text":" for flexible visual storytelling"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Individual Link on every story","marks":[{"type":"bold"}]},{"type":"text","text":" for connecting content to pages, projects, products, or CMS destinations"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Autoplay and looping","marks":[{"type":"bold"}]},{"type":"text","text":" for continuous story playback"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Progress indicators","marks":[{"type":"bold"}]},{"type":"text","text":" showing the current story and playback progress"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Tap navigation","marks":[{"type":"bold"}]},{"type":"text","text":" for quickly moving between stories"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Hold-to-pause interaction","marks":[{"type":"bold"}]},{"type":"text","text":" for a more natural story experience"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Play and pause controls","marks":[{"type":"bold"}]},{"type":"text","text":" for manual playback control"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Sound controls","marks":[{"type":"bold"}]},{"type":"text","text":" with mute and unmute interaction"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Keyboard navigation","marks":[{"type":"bold"}]},{"type":"text","text":" using arrow keys and spacebar"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Blurred or solid backdrop","marks":[{"type":"bold"}]},{"type":"text","text":" for a polished immersive presentation"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Responsive card layout","marks":[{"type":"bold"}]},{"type":"text","text":" that adapts across different screen sizes"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Customizable typography","marks":[{"type":"bold"}]},{"type":"text","text":" for titles and timestamps"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Adjustable card ratio, radius, spacing, colors, and controls","marks":[{"type":"bold"}]}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Poster image support","marks":[{"type":"bold"}]},{"type":"text","text":" for videos and fallback visuals"}]}]}]},{"type":"customHeading","content":[{"type":"text","text":"WHY CUSTOMERS WILL LOVE IT"}],"attrs":{"level":1}},{"type":"paragraph","content":[{"type":"text","text":"Video Story brings the familiar feel of modern social story interfaces into Framer while giving designers full control over the visual presentation. The focused card layout keeps attention on one piece of content at a time, while progress bars, autoplay, tap navigation, and playback controls make the experience intuitive."}]},{"type":"paragraph"}]},"introduction":"Immersive Instagram Video Stories","slug":"video-story","author":{"framerUserId":"38425120-6213-4b66-8b3c-e3e66d07ec64","name":"Interface Studio","slug":"interfacestudio","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/2199676/kD3QNNYGg-bGneREuqMDI2n3QFCDqegiFFxRtaNA","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/38425120-6213-4b66-8b3c-e3e66d07ec64/01a0ce2b-f785-75ab-902d-6b56e1788d60.png","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-09-23T12:09:51.960Z","updatedAt":"2026-09-23T12:09:51.960Z","publishedAt":"2026-09-23T12:09:51.954Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":"https://sub.chujiqiqi.com/m/Tidings-A3u7hG.js@yZmzL2uHI3X3OmOmHUGv","previewUrl":"https://videostory.framer.website/","price":null,"paymentUrl":null,"workshop":false,"categories":[{"id":"8f93ccfe-423c-47f2-b8ae-79e9e132012f","name":"Carousels","slug":"carousels"}],"lastSaveId":"yZmzL2uHI3X3OmOmHUGv","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":5,"liked":false},"comments":{"count":2},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-09-23T12:09:52.571Z","updatedAt":"2026-09-23T12:09:52.571Z","reported":false}}],"$L5f"]

Suggested for you