Landing

Landing blocks

Paste-and-run marketing sections for the AhaSlides landing sites — heroes, feature grids, CTA bands and more. Framework-free HTML + CSS, bound to the same Foundations tokens as the product design system, so marketing and product never drift apart.

Elements

Primary Secondary Tertiary

ButtonMarketing call-to-action buttons for the AhaSlides landing sites. Three emphasis levels — primary, secondary and tertiary — each shown at all three control sizes (sm 28px / md 36px / lg 40px) with its own paste-and-run snippet. They FOLLOW the product Button contract (aha-button): colour, size, radius, weight and motion all bind to the DS Button tokens, so the marketing site and the product app stay on one brand source. The tertiary is the DS ghost button (transparent, purple label, soft purple hover fill) — the same component Webflow ships as its "Text link"; the live Text link's colour-only hover and hard-border focus are logged in landing/SCAN.md as Webflow-to-update items, because the DS ghost definition wins. A promotional pink accent (aha-btn--pink) stays available as a further variant. On a product surface reuse <aha-button> itself; on a framework-free marketing page paste the anchor form.

Explore our documentation, browse ready-made templates, or see pricing before you sign up.

LinkInline text links for landing copy: the brand purple, a soft underline that strengthens on hover, and a quiet variant for footer and secondary links. Colour binds to --aha-color-primary (matching the live site) and weight to --aha-weight-semibold (the DS type scale is 400/600, so the DS wins over the live site's 500). No product Link component exists yet, so this is the landing definition.

Foundations

Display — Nunito

Heading 1 — make the promise big

Heading 2 — a section headline

Heading 3 — a card or sub-section

Lead — a short, confident sentence that sets up the section below it.

Body — the workhorse size for landing copy. The quick brown fox jumps over the lazy dog while three million presenters run their rooms with AhaSlides.

Small — captions, trust lines and fine print.

FontsA landing Foundations-usage page for type: the marketing register of the shared type scale — Plus Jakarta Sans for body (matching the live site) and Nunito (--aha-font-display) reserved for Display and H1 only, each row bound to the DS size, weight, line-height and family tokens. H2/H3 stay on the body face by design (a two-tier headline treatment); the live site uses one face everywhere, so this is a deliberate DS-wins delta, not an oversight. Not a second type source; the same --aha-* tokens the product design system ships. Sizes h1-h6 (48/40/32/24/20/18) match the live site's own --_typography scale token-for-token.

SpacingA landing Foundations-usage page for the spacing rhythm: the same --aha-space-* scale the product design system ships, shown as bars so marketing builders pick padding, gaps and margins from one source. This is not a second token source — every value is the shared token. The live marketing rhythm (section 64/32, gaps 24) maps entirely onto this scale.

Layout

Live pollsAsk, and watch answers land in real time.

QuizzesScore teams and settle it on a leaderboard.

Word cloudsTurn open answers into one shared picture.

Q&ALet the room raise and upvote questions.

Spinner wheelPick a name or a prize at random.

Open endedCollect free-text responses on any slide.

GridA fluid marketing grid for feature cards, logo walls and stat rows. The base grid auto-fits as many columns as fit; the --2 / --3 / --4 variants target that many across on desktop and collapse to a single column on narrow screens with no media queries. Gap and card styling bind to the DS space and radius scales. Mirrors the live site's 1/2/3/4-up grids at a 24px gutter.

Section container

A band that spans full width, with its content centred

The section paints its background edge to edge; the inner column caps the reading width at the landing content max-width and carries the standard vertical rhythm. Add a modifier for a soft or dark band.

Soft band

The same container, tinted, for alternating sections down a page.

Dark band

The same container on the dark surface token, for a high-contrast closing section.

Section containerThe outer wrapper for every landing section: a full-bleed background band with its content centred and capped at the landing content width (1280px), carrying the standard vertical rhythm. Soft and dark variants alternate sections. Grounds directly on the live marketing site (max-width 1280px, section padding ~64/32); framework-free and bound to the shared --aha-* tokens.

Sections

Interactive presentations

Turn every presentation into a conversation

Add live polls, quizzes and word clouds to your slides. Your audience joins from their phones and answers in real time — so you can see what the room thinks the moment they do.

Get started — it’s free Book a demo

3 million presenters at schools, universities and teams worldwide trust AhaSlides.

Which session do you want next?

Live

Live Q&A64%

Team quiz28%

Word cloud8%

HeroA marketing hero for the AhaSlides landing sites: eyebrow, headline, lead, two calls to action and a live-poll product mock. Framework-free and bound entirely to the shared --aha-* tokens.