Drop-in announcement bar for e-commerce sites. Features a flip countdown, one-click coupon copy, a seamless ticker, and 4 built-in themes. Fully responsive across 3 breakpoints, ARIA-accessible, and dismissible with optional localStorage persistence.
Live Preview: https://theannouncementbanner.framer.website/
About
Announcement Banner is a production-ready Framer component built for e-commerce storefronts, landing pages, and promotional campaigns.
Features
• Flip countdown timer — animated digit cells count down days, hours, minutes, and seconds to drive urgency.
• One-click coupon copy — dashed code chip copies to clipboard with animated confirmation feedback.
• Seamless ticker mode — infinite-scrolling marquee strip for high-impact promotional messaging.
• 4 polished themes — Dark, Light, Glass (Purple), and Brand (Orange-Red), each with matching color tokens.
• Full color customization — override label color, countdown color, and CTA button color independently.
• 3-breakpoint responsive layout — Wide, Mid, and Narrow modes via ResizeObserver with hysteresis to prevent flickering.
• Close button with persistence — optional dismiss button; pairs with a localStorage key to hide the banner for a configurable number of days.
• ARIA accessibility — region landmark, aria-hidden on the live countdown, and descriptive labels on interactive controls.
• Demo mode — built-in presentation panel to live-switch themes, toggle Coupon, Countdown, CTA, and Ticker without leaving the canvas.
• Zero dependencies beyond Framer and framer-motion.
Best for
• E-commerce flash sales and limited-time offers
• Seasonal promotions (Black Friday, summer sale, etc.)
• SaaS free-trial or launch announcements
• Landing pages with discount coupon codes
• Any site needing a persistent top-of-page promotional bar
Keywords
Smart bar, promotion banner, promotion bar, newsletter form, bars, banners, announcement bars, announcement banners, announcement banner, promo bar, countdown timer, coupon code, e-commerce banner, notification bar, top bar, sale banner, flip clock, discount banner, responsive banner, dismissible banner, promotional banner, urgency timer, free shipping bar
Ahmet Loca
