Countdown Timers (mj-countdown)
Create dynamic, ticking animated countdown timers for flash sales, webinars, and product drops with automatic expired states.
Key Takeaways
- Real-time animated GIF generation powered by PostBrix sub-50ms countdown microservice.
- Choose from 3 premium layouts: Stacked numbers, Luxury Circles, or Boxed counters.
- Automatic Expired State: displays custom fallback graphics (e.g. "OFFER EXPIRED") when time runs out.
- Client Support: 100% animated support across Apple Mail, Gmail, Yahoo, and webmail; Outlook desktop renders static first frame displaying exact remaining time at open.
The Architecture of In-Email Countdown Timers#
Because email clients strictly prohibit JavaScript execution for security reasons, client-side <script> countdown timers will not run in any modern inbox.
PostBrix solves this by utilizing a high-performance server-side GIF countdown engine:
- On-the-Fly GIF Generation: When a recipient opens the email, their email client requests the timer image from our global CDN.
- Accurate Time Calculation: The microservice calculates the exact duration between the server timestamp and your configured target expiration date.
- 60-Second Animated Sequence: Generates a smooth, second-by-second ticking GIF loop that accurately counts down in real time.
- Cache-Busting Delivery: Short TTL cache headers ensure that reopening the email hours later fetches a newly calculated, accurate countdown sequence.
Configuring Target Dates, Timezones & Layouts#
Select any Countdown block on the canvas to configure its appearance in the right panel:
- Target Expiration: Select your deadline date and time. Choose whether the deadline is pinned to UTC or localized to your campaign timezone.
- Layout Style:
- Stack: Minimalist vertical stack with large numbers and subtle uppercase labels (DAYS, HRS, MINS, SECS).
- Luxury Circles: Circular timer rings ideal for high-end retail, watches, and luxury branding.
- Boxed: High-contrast rectangular cards with separate compartments for each time unit.
- Font Selection: Choose from 1,500+ Google Fonts rendered with 2x sub-pixel anti-aliasing.
- Color Palette & Matte: Set number colors, label colors, and base background color. For transparent containers, configure the edge matte color to ensure crisp contrast without halo artifacts.
Handling Expired Offers Gracefully#
What happens when a customer opens your email after the sale has concluded?
Rather than showing a frozen 00:00:00 or an embarrassing broken image:
- In the Countdown block inspector, define the Expired State Text (e.g., "THIS FLASH SALE HAS ENDED").
- The timer service automatically detects when the current request is past the expiration timestamp.
- It immediately serves a clean, branded "OFFER EXPIRED" banner instead of the clock.
- You can also configure the image link URL to redirect expired visitors to your main catalog or waitlist page.
Email Client Compatibility & Outlook Fallbacks#
Countdown timers render beautifully across all major email clients:
- Apple Mail (iOS & macOS): Full animated 60-second GIF loop.
- Gmail (Web, iOS, Android): Full animated 60-second GIF loop.
- Yahoo & AOL Mail: Full animated 60-second GIF loop.
- Outlook Desktop (Windows Word Engine): Outlook desktop does not animate multi-frame GIFs; it displays only the first frame. PostBrix generates the initial frame with the exact remaining hours, minutes, and seconds at the precise instant of delivery, ensuring Outlook readers still see an accurate urgency snapshot.
Frequently Asked Questions
Does the countdown timer keep ticking while the email is open?
Yes. The animated GIF loops through a 60-second sequence with live second-by-second countdown before looping.
What happens if a recipient opens the email after the timer has already expired?
The PostBrix timer service detects that the target timestamp has passed and automatically displays your custom Expired State message (e.g., "SALE ENDED") or fallback banner.
How does Outlook for Windows handle countdown timers?
Outlook Windows displays the first frame of the GIF, which captures the exact remaining time down to the hour and minute at the moment the email was downloaded.