Design System
View
Digital DS · Events

Webinar banners

One webinar, four screens: the hero on the webinar page, the registration banner that travels with every share link, the title slide on screen while people join, and the header on the invitation email. Each comes in Minimal, Accent, and Bold. All four use the same headline, the same date line, and the same call to action.

Webinar page hero · 1920 × 600

The full-width banner at the top of the webinar page. Outer 240px crop away on narrow screens; keep copy in the centre 1440px. Turn on guides to see the hatched crop bands. Only the photo may run into them.

Registration banner · 1200 × 628

The image that appears when the registration link is shared, and the banner on the registration form. It is often seen at thumbnail size, so the date line is never smaller than 22px.

Webinar title slide · 1920 × 1080

On screen while attendees join and during the welcome. It has no button, because everyone watching has already registered. It shows the host and the three things people will learn.

Event email header · 1200 × 400

The image at the top of the invitation and reminder emails, shown at 600 × 200. The button is not in the image. It is a live HTML button below the header, built from the email templates, so it still works when images are blocked.

Specification

Rules

Copy source. Every word on these templates comes from the webinar record in src/lib/campaign-content.json, and every size from DIGITAL in src/lib/canvas-templates.ts. Change the date there and every template on this page changes with it.