Countdown Wall: Show Multiple Timers on One Screen

A Countdown Wall is a single screen that shows several countdowns at once - perfect for product drops, sprints, events, or class schedules. Below you’ll find ready-made layouts (2×2, 3×2), copy-paste code using our Embed view, and practical tips for TV/monitor setups.

What is a Countdown Wall?

A grid of minimal embedded timers that run side by side on a TV, monitor, or projector. Each tile has a title and the time left - no clutter, just the essentials.

Where it shines

Set it up in 3 steps

  1. Create timers and copy their Embed links (Shift/Alt + Share on the homepage copies the embed URL).
  2. Pick a layout (2×2 or 3×2) and paste each embed URL into the iframe src.
  3. Open full-screen in a modern browser on a TV/monitor.

Copy-paste layouts (2×2, 3×2)

2×2 grid (fits most 16:9 TVs) 
<style>
.pc-wall { display:grid; gap:16px; grid-template-columns: repeat(2, 1fr); }
.pc-tile { background:#0b0b0c; padding:8px; border-radius:12px; }
.pc-tile iframe { width:100%; height:220px; border:0; border-radius:8px; }
@media (min-width: 1100px) { .pc-tile iframe { height:260px; } }
@media (max-width: 640px) { .pc-wall { grid-template-columns: 1fr; } }
</style>

<div class="pc-wall">
  <div class="pc-tile">
    <iframe src="../embed.html?title=Release%20v2.3&ts=2025-10-01T10:00:00Z" title="Release v2.3"></iframe>
  </div>
  <div class="pc-tile">
    <iframe src="../embed.html?title=Client%20Demo&ts=2025-09-05T14:00:00Z" title="Client Demo"></iframe>
  </div>
  <div class="pc-tile">
    <iframe src="../embed.html?title=Sprint%20End&ts=2025-09-12T16:00:00Z" title="Sprint End"></iframe>
  </div>
  <div class="pc-tile">
    <iframe src="../embed.html?title=All-Hands&ts=2025-09-15T09:00:00Z" title="All-Hands"></iframe>
  </div>
</div>
3×2 grid (more events, slightly smaller tiles) 
<style>
.pc-wall { display:grid; gap:14px; grid-template-columns: repeat(3, 1fr); }
.pc-tile { background:#0b0b0c; padding:8px; border-radius:12px; }
.pc-tile iframe { width:100%; height:200px; border:0; border-radius:8px; }
@media (min-width: 1400px) { .pc-tile iframe { height:220px; } }
@media (max-width: 900px)  { .pc-wall { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px)  { .pc-wall { grid-template-columns: 1fr; } }
</style>

<div class="pc-wall">
  <div class="pc-tile"><iframe src="../embed.html?title=Doors%20Open&ts=2025-09-03T16:30:00Z" title="Doors Open"></iframe></div>
  <div class="pc-tile"><iframe src="../embed.html?title=Keynote&ts=2025-09-03T18:00:00Z" title="Keynote"></iframe></div>
  <div class="pc-tile"><iframe src="../embed.html?title=Break&ts=2025-09-03T19:30:00Z" title="Break"></iframe></div>
  <div class="pc-tile"><iframe src="../embed.html?title=Panel&ts=2025-09-03T20:00:00Z" title="Panel"></iframe></div>
  <div class="pc-tile"><iframe src="../embed.html?title=Afterparty&ts=2025-09-03T22:00:00Z" title="Afterparty"></iframe></div>
  <div class="pc-tile"><iframe src="../embed.html?title=Doors%20Close&ts=2025-09-03T23:59:00Z" title="Doors Close"></iframe></div>
</div>

Hardware & display tips

  • TV/monitor size: 43–55″ works well from 2–4 m away.
  • Browser: use a modern, full-screen browser (Chrome, Edge, Safari).
  • Orientation: landscape for 2×2 and 3×2; portrait TVs can use 2×3.
  • Contrast: dark solid background behind the grid improves readability.

Accessibility & performance

  • Keep backgrounds simple; avoid busy images behind iframes.
  • Test from the viewing distance - digits should be legible at a glance.
  • Limit to one page per screen to keep CPU usage low on older sticks/mini PCs.

Troubleshooting

One tile shows “Invalid date”

Check the ts=... value. Use ISO like 2025-12-31T23:59:59Z or epoch seconds.

I see scrollbars inside tiles

Increase the iframe height (e.g., 220→260 px) or reduce top/bottom padding of the tile.

Times look off for some viewers

Use UTC (append “Z”) or specify the correct local time when generating each embed link.

Related

Create your wall now

Generate embed links from the homepage (Shift/Alt + Share), paste them into the layout above, and go full screen. That’s it.

← Back to PerfectCountdown