66:I[267044,["/creators-assets/_next/static/immutable/chunks/356g_j0l71_46.js","/creators-assets/_next/static/immutable/chunks/3gx96u50v9idb.js","/creators-assets/_next/static/immutable/chunks/125_ce2ese0y_.js","/creators-assets/_next/static/immutable/chunks/2ii8lkleumgkk.js","/creators-assets/_next/static/immutable/chunks/1jubx4t_1hq7l.js","/creators-assets/_next/static/immutable/chunks/0c6romi9ma0is.js","/creators-assets/_next/static/immutable/chunks/069_m7850i8jf.js","/creators-assets/_next/static/immutable/chunks/03586ab1rea-b.js","/creators-assets/_next/static/immutable/chunks/19qq0hy3mz_vv.js","/creators-assets/_next/static/immutable/chunks/2oixy7hansmjm.js","/creators-assets/_next/static/immutable/chunks/2rczsbgoa3afm.js","/creators-assets/_next/static/immutable/chunks/2a63j-5qkrdf4.js","/creators-assets/_next/static/immutable/chunks/2504rifrkrd_l.js","/creators-assets/_next/static/immutable/chunks/0-lv0573a1cyl.js","/creators-assets/_next/static/immutable/chunks/3kkqflhmmpg9p.js","/creators-assets/_next/static/immutable/chunks/0ib-rcz4b0eq3.js","/creators-assets/_next/static/immutable/chunks/0mgwzh6o644jl.js","/creators-assets/_next/static/immutable/chunks/24gcuxpvxd8dy.js","/creators-assets/_next/static/immutable/chunks/0xd4yj8g3g-ci.js","/creators-assets/_next/static/immutable/chunks/2-y_r3u4wh2s3.js","/creators-assets/_next/static/immutable/chunks/3vd9_7_mqx0kl.js","/creators-assets/_next/static/immutable/chunks/3l37d07td4kzk.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/3nw4q_evu8ge1.js","/creators-assets/_next/static/immutable/chunks/3o5qsyzxffd89.js","/creators-assets/_next/static/immutable/chunks/0sdd6rzuigoor.js","/creators-assets/_next/static/immutable/chunks/04onqby6uwgz7.js","/creators-assets/_next/static/immutable/chunks/16d5vpfsnfybw.js","/creators-assets/_next/static/immutable/chunks/3f4d4x4z1mrzh.js","/creators-assets/_next/static/immutable/chunks/0yulab_mho2q7.js","/creators-assets/_next/static/immutable/chunks/3_6nvj55e699g.js","/creators-assets/_next/static/immutable/chunks/2r15b2hek61lg.js","/creators-assets/_next/static/immutable/chunks/14pxn0b6e1dc9.js","/creators-assets/_next/static/immutable/chunks/0pc9t50m5x90i.js","/creators-assets/_next/static/immutable/chunks/3fyhezch4qqad.js","/creators-assets/_next/static/immutable/chunks/3eh5q_6ksmw0l.js","/creators-assets/_next/static/immutable/chunks/2rdaqkxiyeq_6.js","/creators-assets/_next/static/immutable/chunks/2qeyp4zfa4qwb.js","/creators-assets/_next/static/immutable/chunks/0v2aom8xv86j9.js","/creators-assets/_next/static/immutable/chunks/19r4rf2zyng-y.js","/creators-assets/_next/static/immutable/chunks/0s-n7u5-dwtml.js"],"S"] 67:Ta93,

Live Countdown

A premium, real-time countdown timer component built for Framer with a modern glassmorphism interface and fully responsive layout. The component continuously counts down to a configurable target date, making it ideal for product launches, upcoming events, flash sales, webinars, promotions, giveaways, and "Coming Soon" landing pages.

Features

Countdown Tiimer – Automatically updates every second without requiring page refreshes.
Editable Target Date – Set any future date directly from the Framer Properties panel.
Four Time Units – Displays Days, Hours, Minutes, and Seconds in separate cards.
Responsive Design – Scales beautifully across desktop, tablet, and mobile devices using fluid typography and flexible sizing.
Glassmorphism UI – Elegant frosted-glass cards with subtle borders, shadows, and blur effects for a premium appearance.
Modern Gradient Background – Includes layered gradients and soft radial lighting for added visual depth.
Automatic Completion – When the countdown reaches zero, all values stop at 00 instead of displaying negative numbers.
Performance Optimized – Uses efficient React hooks (useState, useEffect, and useCallback) with a single one-second interval for smooth updates.
Tabular Number Formatting – Ensures numbers remain perfectly aligned while counting down.
Zero Padding – Single-digit values automatically display as two digits (e.g. 01, 09).
Reusable Component – Easily drop into any Framer project and customize the target date without editing the code.
Flexible Layout – Cards automatically distribute evenly across the available width while maintaining consistent spacing.
Clean Visual Hierarchy – Large bold numbers, uppercase labels, rounded corners, and balanced spacing improve readability.

Perfect for:

Product launches
SaaS landing pages
Coming Soon pages
Flash sales
Limited-time offers
Event countdowns
Webinar registrations
Holiday campaigns
Marketing websites
Portfolio websites

65:["$","$L66",null,{"value":{"fallback":{"$inf$activity-creator-860d8f69-f36d-41fe-bba0-53f7fc68a0ca-all:/unified/creator/860d8f69-f36d-41fe-bba0-53f7fc68a0ca/activity/":[{"data":[{"id":"019f5b55-35b7-714c-a474-2f74ad595972","type":"component.created","target":{"type":"component","id":"KBaTJ1KOo1rsJ25zn7Dg","preview":"Live Countdown","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/860d8f69-f36d-41fe-bba0-53f7fc68a0ca/019f5b34-6689-73ed-915b-fe94da9100f7.jpg","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"860d8f69-f36d-41fe-bba0-53f7fc68a0ca","name":"Joshua Oloruntoke","avatar":null,"slug":"joshua-oloruntoke","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":"component","visibility":"public","startedAt":"2026-07-13T11:55:38.807Z","latestAt":"2026-07-13T11:55:38.807Z"}],"pagination":{"next":null,"previous":null},"totalCount":"$undefined","feedSession":"$undefined"}],"$inf$posts:860d8f69-f36d-41fe-bba0-53f7fc68a0ca:/unified/posts/?creator=860d8f69-f36d-41fe-bba0-53f7fc68a0ca&with=reposts":[{"data":[{"id":"019f5b55-3402-727e-a347-52459aeb8024","title":null,"body":"

⏳ New Countdown Timer component is live! Clean design, real-time updates, editable target date, and ready to use in any Framer project.

","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"emoji","attrs":{"name":"hourglass_flowing_sand","emoji":"⏳"}},{"type":"text","text":" New Countdown Timer component is live! Clean design, real-time updates, editable target date, and ready to use in any Framer project."}]}]},"author":{"framerUserId":"860d8f69-f36d-41fe-bba0-53f7fc68a0ca","name":"Joshua Oloruntoke","slug":"joshua-oloruntoke","avatar":null,"followed":false,"followsYou":false},"media":[],"resources":[{"id":"KBaTJ1KOo1rsJ25zn7Dg","resolved":true,"title":"Live Countdown","body":"$67","bodyJson":{"type":"doc","content":[{"type":"customHeading","content":[{"type":"text","text":"Live Countdown","marks":[{"type":"bold"}]}],"attrs":{"level":1}},{"type":"paragraph","content":[{"type":"text","text":"A premium, real-time countdown timer component built for Framer with a modern glassmorphism interface and fully responsive layout. The component continuously counts down to a configurable target date, making it ideal for product launches, upcoming events, flash sales, webinars, promotions, giveaways, and \"Coming Soon\" landing pages."}]},{"type":"customHeading","content":[{"type":"text","text":"Features"}],"attrs":{"level":1}},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Countdown Tiimer","marks":[{"type":"bold"}]},{"type":"text","text":" – Automatically updates every second without requiring page refreshes."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Editable Target Date","marks":[{"type":"bold"}]},{"type":"text","text":" – Set any future date directly from the Framer Properties panel."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Four Time Units","marks":[{"type":"bold"}]},{"type":"text","text":" – Displays Days, Hours, Minutes, and Seconds in separate cards."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Responsive Design","marks":[{"type":"bold"}]},{"type":"text","text":" – Scales beautifully across desktop, tablet, and mobile devices using fluid typography and flexible sizing."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Glassmorphism UI","marks":[{"type":"bold"}]},{"type":"text","text":" – Elegant frosted-glass cards with subtle borders, shadows, and blur effects for a premium appearance."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Modern Gradient Background","marks":[{"type":"bold"}]},{"type":"text","text":" – Includes layered gradients and soft radial lighting for added visual depth."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Automatic Completion","marks":[{"type":"bold"}]},{"type":"text","text":" – When the countdown reaches zero, all values stop at "},{"type":"text","text":"00","marks":[{"type":"bold"}]},{"type":"text","text":" instead of displaying negative numbers."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Performance Optimized","marks":[{"type":"bold"}]},{"type":"text","text":" – Uses efficient React hooks ("},{"type":"text","text":"useState","marks":[{"type":"code"}]},{"type":"text","text":", "},{"type":"text","text":"useEffect","marks":[{"type":"code"}]},{"type":"text","text":", and "},{"type":"text","text":"useCallback","marks":[{"type":"code"}]},{"type":"text","text":") with a single one-second interval for smooth updates."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Tabular Number Formatting","marks":[{"type":"bold"}]},{"type":"text","text":" – Ensures numbers remain perfectly aligned while counting down."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Zero Padding","marks":[{"type":"bold"}]},{"type":"text","text":" – Single-digit values automatically display as two digits (e.g. "},{"type":"text","text":"01","marks":[{"type":"bold"}]},{"type":"text","text":", "},{"type":"text","text":"09","marks":[{"type":"bold"}]},{"type":"text","text":")."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Reusable Component","marks":[{"type":"bold"}]},{"type":"text","text":" – Easily drop into any Framer project and customize the target date without editing the code."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Flexible Layout","marks":[{"type":"bold"}]},{"type":"text","text":" – Cards automatically distribute evenly across the available width while maintaining consistent spacing."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Clean Visual Hierarchy","marks":[{"type":"bold"}]},{"type":"text","text":" – Large bold numbers, uppercase labels, rounded corners, and balanced spacing improve readability."}]}]}]},{"type":"paragraph","content":[{"type":"text","text":"Perfect for:"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Product launches"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"SaaS landing pages"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Coming Soon pages"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Flash sales"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Limited-time offers"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Event countdowns"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Webinar registrations"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Holiday campaigns"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Marketing websites"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Portfolio websites"}]}]}]}]},"introduction":"Every Second Brings You Closer!!!!","slug":"live-countdown","author":{"framerUserId":"860d8f69-f36d-41fe-bba0-53f7fc68a0ca","name":"Joshua Oloruntoke","slug":"joshua-oloruntoke","avatar":null,"followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/860d8f69-f36d-41fe-bba0-53f7fc68a0ca/019f5b34-6689-73ed-915b-fe94da9100f7.jpg","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-07-13T11:55:37.998Z","updatedAt":"2026-07-13T12:23:18.987Z","publishedAt":"2026-07-13T11:55:37.995Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":"https://framer.com/m/Live-Countdown-veaJkh.js@LaYwF4OnpWK51HuBgM9q","previewUrl":"https://aqua-performance-669613.framer.app/","price":null,"paymentUrl":null,"workshop":false,"categories":[{"id":"7677fa83-43ce-41a2-a3fe-db438ec0fd33","name":"Interactive","slug":"interactive"}],"lastSaveId":"LaYwF4OnpWK51HuBgM9q","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":4,"liked":false},"comments":{"count":1},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-07-13T11:55:38.370Z","updatedAt":"2026-07-13T11:55:38.370Z"}],"pagination":{"next":null,"previous":null},"totalCount":"$undefined","feedSession":"$undefined"}]}},"children":"$L68"}]