56:I[473921,["/creators-assets/_next/static/immutable/chunks/1hsplt7jfjgnh.js","/creators-assets/_next/static/immutable/chunks/0ct7__d3eqq0r.js","/creators-assets/_next/static/immutable/chunks/0c-r9a3oxph1w.js","/creators-assets/_next/static/immutable/chunks/3283ev4bymz-y.js","/creators-assets/_next/static/immutable/chunks/1tyeiicl34tqo.js","/creators-assets/_next/static/immutable/chunks/24bk4ojcoor5n.js","/creators-assets/_next/static/immutable/chunks/1co9epfn9jp6v.js","/creators-assets/_next/static/immutable/chunks/1zalsqf-ioaic.js","/creators-assets/_next/static/immutable/chunks/00hohn9l3ocx9.js","/creators-assets/_next/static/immutable/chunks/06p8bv9p94pxh.js","/creators-assets/_next/static/immutable/chunks/2e-sz6cfsc9_9.js","/creators-assets/_next/static/immutable/chunks/1eyot9c9uwocm.js","/creators-assets/_next/static/immutable/chunks/3or5zvywp1ubp.js","/creators-assets/_next/static/immutable/chunks/1k3rwcufrnywl.js","/creators-assets/_next/static/immutable/chunks/2-y_r3u4wh2s3.js","/creators-assets/_next/static/immutable/chunks/3fujn21cf_mt1.js","/creators-assets/_next/static/immutable/chunks/0mgwzh6o644jl.js","/creators-assets/_next/static/immutable/chunks/3uo-268z2xnq9.js","/creators-assets/_next/static/immutable/chunks/0vxt9zvn936s0.js","/creators-assets/_next/static/immutable/chunks/0lx6ikbaymow8.js","/creators-assets/_next/static/immutable/chunks/15z5hu5cixks0.js","/creators-assets/_next/static/immutable/chunks/3q5wansxm4vp6.js","/creators-assets/_next/static/immutable/chunks/102julo6bufcv.js","/creators-assets/_next/static/immutable/chunks/0ina8hhu8zfh2.js","/creators-assets/_next/static/immutable/chunks/2ch5kewqiwntv.js","/creators-assets/_next/static/immutable/chunks/3e73rezw4k1a2.js","/creators-assets/_next/static/immutable/chunks/2_dm0za3asre2.js","/creators-assets/_next/static/immutable/chunks/1mpx4d_3k5had.js","/creators-assets/_next/static/immutable/chunks/3nd1mzwm7q_f7.js","/creators-assets/_next/static/immutable/chunks/0toe1wcov_38e.js","/creators-assets/_next/static/immutable/chunks/3_ujmu63m88vf.js","/creators-assets/_next/static/immutable/chunks/25l6djez1lvts.js","/creators-assets/_next/static/immutable/chunks/3pe6luvwzbwnz.js","/creators-assets/_next/static/immutable/chunks/3k6sa9ujkqb5c.js","/creators-assets/_next/static/immutable/chunks/3un-l23eued0s.js","/creators-assets/_next/static/immutable/chunks/3nzo9vld-4e3c.js","/creators-assets/_next/static/immutable/chunks/0l9v835j421-s.js","/creators-assets/_next/static/immutable/chunks/2warb3xv9rce7.js","/creators-assets/_next/static/immutable/chunks/31lxg3j13mof7.js"],"PostDetailCard"] 57:T772,

What is Loop Timeline?

Loop Timeline is an interactive circular timeline that transforms linear content into an engaging wheel interface. Visitors can drag to rotate, or sit back as it auto-spins through your content. Ideal for process flows, daily schedules, quarterly plans, achievement showcases, and feature highlights that need to stand out.

Core Features

Auto-rotating wheel with adjustable speed and smooth spring animations
Click-to-select and drag-to-rotate interactions with grab cursor feedback
8 built-in theme presets including Day Cycle, Seasons, Steps, and Achievements
Animated center panel displaying segment title, description, and icon
Responsive sizing that adapts to any container
Custom segment data support for complete content control

Controls inside Framer

Theme and Layout

Theme selector with 8 presets plus Custom mode
Segment count (2, 3, or 4 segments)
Center content layout (Icon + Text or Text Only)

Animation

Auto-rotate toggle
Rotation speed control

Typography

Font family selector
Font weight control

Custom Data

Per-segment title, description, and icon overrides

Best use cases

Daily routine or schedule visualisations for lifestyle and productivity sites
Step-by-step process flows for SaaS onboarding or service pages
Quarterly or seasonal content for business and marketing sites
Achievement and milestone showcases for portfolios and case studies

Elevate your timeline content from static lists to an interactive experience that keeps visitors engaged and exploring.

53:[["$","$L56",null,{"post":{"id":"019cb412-324b-7d59-a993-78e482b38f9f","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"04c866a7-3fd7-4257-aa25-1cd7ed251101","name":"Ahmad","slug":"colab-colab","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/04c866a7-3fd7-4257-aa25-1cd7ed251101/p63gez2m","followed":false,"followsYou":false},"media":[],"resources":[{"id":"R3qn0vBhMzih0Vg6O9Hp","resolved":true,"title":"Circle Timeline","body":"$57","bodyJson":null,"introduction":"Interactive rotating timeline with icons","slug":"circle-timeline","author":{"framerUserId":"04c866a7-3fd7-4257-aa25-1cd7ed251101","name":"Ahmad","slug":"colab-colab","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/04c866a7-3fd7-4257-aa25-1cd7ed251101/p63gez2m","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/R3qn0vBhMzih0Vg6O9Hp/circle-timeline-vJ9oI2wXjZQKnoaDPiPJ5wRIqnxnc4","metadata":{"tint":{"h":240,"s":50,"l":6},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-02-24T09:44:02.022Z","updatedAt":"2026-03-12T23:03:46.854Z","publishedAt":"2026-03-03T14:20:17.355Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://lower-channels-785349.framer.app/","price":"13","paymentUrl":"https://madanie232.gumroad.com/l/evirvd","workshop":false,"categories":[{"id":"5c50a4d9-4405-49ca-8956-4909a204480d","name":"Sections","slug":"sections"}],"lastSaveId":"1ZMTI2B3g87jtY60lj0w","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":1,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-03-03T14:20:17.355Z","updatedAt":"2026-03-03T14:20:17.355Z","reported":false,"type":"post"}}],"$L58"]

Suggested for you