Context & Components.
Required, recommended, and optional inputs. Complete component library for building slides.
Presentation Brief Template
Use this template when preparing your brief for the agent.
TOPIC / TITLE
What is this presentation about? (e.g., “The Future of AI”, “Q1 Product Roadmap”)
KEY MESSAGE
The main takeaway in one sentence. What do you want the audience to believe or do?
AUDIENCE
Who is this for? (e.g., “C-suite executives”, “Product teams”, “Enterprise customers”)
TALKING POINTS
3-5 key ideas you want to cover. Bullet list or numbered outline.
DATA / STATISTICS (optional but recommended)
Numbers, percentages, metrics that support your talking points. Include source if available.
DESIRED SLIDE COUNT (optional)
How many slides? Default is 8-12. E.g., “I want 10 slides” or “6-8 slides, tight narrative.”
BRAND COLORS (optional)
Override default accent. Provide hex codes (e.g., #b8e8fd).
SPECIFIC QUOTES (optional)
Any key quotes you want featured. Include source.
CALL-TO-ACTION (optional)
What do you want the audience to do next? URL, email, date, action.
Pro tip. The more detail in your brief, the better the deck. Spend 5 minutes writing a clear brief. It saves 10 minutes of back-and-forth.
Default Settings
Type, color, background, and layout defaults the agent uses unless overridden in the brief.
Fonts
- Headings: Lato Black (900) with tight tracking — bold and clean
- Body: Lato Light (300) — clean, readable
- Labels / code: Lato (sans-serif, used at smaller sizes and uppercase)
Colors
Slide backgrounds
- bg-dark: Dark Navy background, white text. Use for hero, quotes, closing.
- bg-ivory: Linen background, dark text. Use for stat grids, context.
- bg-white: White background, dark text. Use for split layouts, key points.
Typical flow: dark (hero) → ivory (context) → white (point 1) → ivory (point 2) → white (point 3) → dark (quote / insight) → ivory (CTA)
Layout grid
- Max-width content: 720px (desktop), full-width on mobile
- Padding: 8% left / right on desktop, responsive on mobile
- Slide padding: 80px vertical, 60px horizontal (desktop full-screen slides)
Component Library
All building blocks available for assembling slides. Copy HTML structure from the golden example and customize content.
Stat Grid (3-column)
Use for: Three key statistics or data points.
Structure: Container with .stat-grid. Inside: 3 cards with .stat-card. Each card has .stat-num, .stat-label, .stat-desc.
Stat Grid (4-column)
Use for: Four key statistics. Add .stat-grid--4 to container.
Example: Risk % + Market size + Budget trend + Competitive threats.
Reality Grid (3-column)
Use for: Thematic cards with narrative structure (regulatory landscape, customer segments, risk categories).
Structure: 3 cards with .reality-num, .reality-title, .reality-desc. Optional .reality-quote block below.
Split Layout
Use for: Concept on left, visual (image / mockup / diagram) on right.
Structure: .split-layout with .split-text and .split-visual. Stacks vertically on mobile.
Quote Block
Use for: Full-screen quote on dark background. High impact.
Structure: Large italic text (22px+), source attribution below in muted color.
Section Label
Use for: Visual hierarchy within a slide. Uppercase label before headline.
Class: .section-label
Signature Line
Use for: Decorative divider between sections. Thin rotated line.
Class: .sig-line (white on dark) or .sig-line--dark (dark on light).
Company Grid (5-column)
Use for: Logo mentions, brand references, partner logos.
Structure: 5 cards with .company-name, .company-stat, .company-desc.
Q&A Rows
Use for: FAQ, key takeaways, closing thoughts.
Structure: .questions-list containing .question-row items. Each row = question (left) | answer (right).
Hero Section
Use for: Title / hero slide. Large heading, subtitle, optional badge.
Structure: .hero-inner with h1, .hero-subtitle, optional .hero-badge.
Brief Example
A complete worked example of the template above, ready to feed into the agent.
TOPIC: “The Future of Enterprise AI”
KEY MESSAGE: “Every enterprise will adopt AI in the next 18 months. Success depends on responsible governance.”
AUDIENCE: CTO / VP Engineering roles at mid-market SaaS companies
TALKING POINTS:
- AI adoption is accelerating across industries — it’s no longer optional
- The biggest risk is governance, not technology. Most failures stem from poor controls
- Responsible AI requires cross-functional collaboration (engineering, legal, product, finance)
DATA:
- 87% of CTOs plan to increase AI investment in 2026 (Gartner, Jan 2026)
- 62% of AI projects fail due to governance issues (McKinsey, 2025)
- Enterprise AI market projected at $2.1T by 2030 (IDC)
DESIRED SLIDE COUNT: 9 slides
CALL-TO-ACTION: “Join our AI governance workshop. Register at [URL]”
Common Patterns
Reusable rhythms that make decks feel intentional rather than assembled.
Data presentation
For stat-heavy topics, use stat grids with 3-4 data points per slide. Each stat should reinforce a talking point.
Narrative flow
Problem → Context → Solution 1 → Solution 2 → Solution 3 → Insight → Call-to-action. Each slide advances the story.
Visual alternation
Don’t overload with color. Alternate dark ↔ ivory ↔ white backgrounds. This creates rhythm and prevents fatigue.
Typography hierarchy
H1 (hero): 48-72px. H2 (slide headline): 36-56px. Body: 18-22px. Labels: 11-15px. Always readable on mobile (min 16px for body).