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/077g_l9cwe8hz.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/2ouyrs2yz196q.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/3-tcb9ouhlqkm.js","/creators-assets/_next/static/immutable/chunks/3n0g19afc7srh.js","/creators-assets/_next/static/immutable/chunks/41zrh_r6fdtfq.js","/creators-assets/_next/static/immutable/chunks/120zfy8hqrcwf.js","/creators-assets/_next/static/immutable/chunks/14pxn0b6e1dc9.js","/creators-assets/_next/static/immutable/chunks/2njnkxjf39nsf.js","/creators-assets/_next/static/immutable/chunks/1p31g3z3kho5v.js","/creators-assets/_next/static/immutable/chunks/17w9c6wazundy.js","/creators-assets/_next/static/immutable/chunks/2885u7skzba5_.js","/creators-assets/_next/static/immutable/chunks/1u1uuj9mj0hoo.js","/creators-assets/_next/static/immutable/chunks/1fo1h_o5odhhk.js","/creators-assets/_next/static/immutable/chunks/2iw_-bo8jogap.js","/creators-assets/_next/static/immutable/chunks/1_2vu9p6mra4j.js","/creators-assets/_next/static/immutable/chunks/3zq_69yv5l6lg.js","/creators-assets/_next/static/immutable/chunks/2qeyp4zfa4qwb.js","/creators-assets/_next/static/immutable/chunks/0v-er0xp5q011.js","/creators-assets/_next/static/immutable/chunks/19r4rf2zyng-y.js","/creators-assets/_next/static/immutable/chunks/19-jcjdymr-fa.js","/creators-assets/_next/static/immutable/chunks/2rwbpl35w01v4.js","/creators-assets/_next/static/immutable/chunks/37uei1iwbnu3m.js","/creators-assets/_next/static/immutable/chunks/3o1z26bd2_9eh.js","/creators-assets/_next/static/immutable/chunks/05i2jce8amocn.js","/creators-assets/_next/static/immutable/chunks/44oc0x6k7mw-i.js","/creators-assets/_next/static/immutable/chunks/0djs9po3g19ek.js","/creators-assets/_next/static/immutable/chunks/1_ej2mmnwnp37.js","/creators-assets/_next/static/immutable/chunks/2qrxli96_t9cq.js","/creators-assets/_next/static/immutable/chunks/3o3dwck1w1ue6.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/0bcmpcsc4ih7d.js"],"PostDetailCard"] 5d:T909,

Logo Cycle Pro is an animated logo grid designed for Framer websites.

It displays logos in a clean grid layout and continuously swaps them with smooth transitions, creating a dynamic and engaging visual section. Perfect for showcasing clients, partners, or brand collaborations without overwhelming the layout.

The component includes multiple animation styles like Blur Rise, Slide, Crossfade, Drift, and Reveal — allowing you to match the motion to your brand style.

You can fully control grid layout, animation speed, logo sizing, and styling directly from the property panel.

Features

Animated Logo CyclingLogos automatically swap at set intervals, keeping the section dynamic and visually engaging.

Multiple Animation StylesChoose from five animation types:• Blur Rise• Slide• Crossfade• Drift• Reveal

Flexible Grid LayoutControl the number of columns and rows to fit any layout.

Full CustomizationAdjust:• Logo size• Grid gap• Cell background• Border radius• Animation timing

Smart Logo RotationEnsures logos don’t repeat immediately, creating a smooth and natural cycling effect.

Canvas-Friendly PreviewAnimations are disabled on the canvas for a clean editing experience and only run in preview/live mode.

How to Use

Step 1 — Add the component

Paste the component into your Framer canvas.

Step 2 — Set your grid

Adjust columns and rows to define how many logos are visible.

Step 3 — Add logos

Upload your brand or client logos in the property panel.

Step 4 — Choose animation

Select an animation style and adjust timing.

Step 5 — Customize styling

Fine-tune spacing, colors, and logo sizing to match your design.

Ideal Use Cases

SaaS landing pages • Agency websites • Startup websites • Portfolio projects • Client/partner showcase sections

Property Controls

59:[["$","$L5c",null,{"post":{"id":"019d4829-9b34-7d6f-9ac6-b2dc983ad574","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"0377da32-5157-43ad-9c57-e949e915db9e","name":"Daniyal Habib","slug":"daniyalweb","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1271714/avatar-8E77IXnX9HLKLrOPuUGBp3gf2I7AYE.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"K5fRQmIJOS9KavHEnU5A","resolved":true,"title":"Logo Cycle Pro","body":"$5d","bodyJson":null,"introduction":"Animated logo grid with smooth cycling","slug":"logo-cycle-pro","author":{"framerUserId":"0377da32-5157-43ad-9c57-e949e915db9e","name":"Daniyal Habib","slug":"daniyalweb","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1271714/avatar-8E77IXnX9HLKLrOPuUGBp3gf2I7AYE.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/K5fRQmIJOS9KavHEnU5A/logo-cycle-pro-U1SX4MUUDBcR4nYmD2xi5qInGKK9si"}],"post":null,"createdAt":"2026-03-19T18:24:31.121Z","updatedAt":"2026-07-07T13:36:26.146Z","publishedAt":"2026-04-01T08:29:39.508Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://weekly-stegosaurus-185279.framer.app/","price":"6","paymentUrl":"https://daniyalweb.gumroad.com/l/exrcmh?wanted=true","workshop":false,"categories":[{"id":"5c50a4d9-4405-49ca-8956-4909a204480d","name":"Sections","slug":"sections"}],"lastSaveId":"EVGX8csyuBGFoVfmQkCY"}}],"contests":[],"categories":[],"tags":[],"likes":{"count":14,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-04-01T08:29:39.508Z","updatedAt":"2026-04-01T08:29:39.508Z","reported":false}}],"$L5e"]

Suggested for you