# Landing pages

> Complete, single-file landing pages with every section, from nav to footer, ready to hand to a coding agent and rebrand.

## Types

Every landing page has one, set as `subcategory` in meta.json. Filter with `?subcategory=` on the JSON API or `subcategory` in the MCP search tool.

- [SaaS](https://www.assembli.design/category/landing-pages/saas.md) (`saas`, 10): Software products: CRMs, developer tools, dashboards and B2B platforms.
- [AI products](https://www.assembli.design/category/landing-pages/ai.md) (`ai`, 10): Model-powered tools: generators, assistants, copilots and agents.
- [Product launches](https://www.assembli.design/category/landing-pages/product.md) (`product`, 1): Hardware, gadgets, apps and consumer products with a launch story.
- [E-commerce](https://www.assembli.design/category/landing-pages/ecommerce.md) (`ecommerce`, 0): Online stores, direct-to-consumer brands and product catalogues.
- [Portfolios](https://www.assembli.design/category/landing-pages/portfolio.md) (`portfolio`, 10): Personal sites for designers, developers, photographers and other creatives.
- [Agencies & studios](https://www.assembli.design/category/landing-pages/agency.md) (`agency`, 7): Design, development and marketing agencies, studios and consultancies.
- [Home services](https://www.assembli.design/category/landing-pages/home-services.md) (`home-services`, 0): Plumbers, electricians, cleaners, landscapers, roofers and other trades.
- [Food & hospitality](https://www.assembli.design/category/landing-pages/hospitality.md) (`hospitality`, 0): Restaurants, cafés, bars, hotels and venues.
- [Health & wellness](https://www.assembli.design/category/landing-pages/health.md) (`health`, 1): Clinics, dentists, therapists, gyms and wellness brands.
- [Finance](https://www.assembli.design/category/landing-pages/finance.md) (`finance`, 7): Fintech, banking, accounting, insurance and investing.
- [Education](https://www.assembli.design/category/landing-pages/education.md) (`education`, 0): Courses, schools, coaching, bootcamps and learning platforms.
- [Real estate](https://www.assembli.design/category/landing-pages/real-estate.md) (`real-estate`, 0): Agents, property listings, developments and rentals.
- [Events](https://www.assembli.design/category/landing-pages/events.md) (`events`, 0): Conferences, meetups, festivals, weddings and launches with a date.
- [Nonprofits & community](https://www.assembli.design/category/landing-pages/nonprofit.md) (`nonprofit`, 0): Charities, causes, open-source projects and communities.

## SaaS

> Software products: CRMs, developer tools, dashboards and B2B platforms.

- [Switchyard — AI Workflow Landing](https://www.assembli.design/components/switchyard-landing.md): Dark editorial SaaS template for a fictional AI workflow platform, in warm graphite and signal amber: a stacked deck of live account records, a framed grid of stats and logos, a scroll-filled track past five working panels (call lanes, signal switching, a tone-shifting draft, an approval queue, a growth chart), a quote-led marquee, a prompt box, plan comparison, FAQ and CTA.
- [Cairn — AI Visibility Landing](https://www.assembli.design/components/cairn-landing.md): AI-search visibility SaaS template in porcelain, ultramarine and marigold: a headline tile that flips through answer engines, a live prompt box over a share-of-voice dashboard, a five-card bento, chats that replay on scroll, phone screens, stories, pricing, FAQ and a closing CTA.
- [Headwater — Data Answers Landing](https://www.assembli.design/components/headwater-landing.md): Ask-your-data SaaS template built on a river: sources are tributaries that keep their colour in the main stream, so the river is also the answer's streamgraph. Questions re-form the hero watershed, a hover-to-trace lineage explorer, a long-profile how-it-works, an Ask chart, flood alerts on a staff gauge, outcomes, stories, pricing and an FAQ.
- [Kiln — Outbound Sales Landing](https://www.assembli.design/components/kiln-landing.md): Outbound sales template built around a kiln: a soot-dark hero with an ember glow that follows the cursor, a live intent dashboard with a scrubbable chart, four glaze-coloured stage cards that stack while a thermometer climbs, a typing email composer, an editable sequence, a case-study chart, pricing and auto-scrolling reviews.
- [Porchlight — Hiring & Onboarding Landing](https://www.assembli.design/components/porchlight-landing.md): Warm hiring and onboarding template built on 'leave the light on': a lamp you can switch off, lamplight behind key words, a tilting hiring dashboard with stage filters and bulk actions, a live activity log, tickable first-week plans, CV screening that lights matching lines, pricing and a night-sky CTA.
- [Ashlar — Block Automation Landing](https://www.assembli.design/components/ashlar-landing.md): Back-office automation template drawn on an architect's sheet: ruled rails and numbered section tags, an isometric hero block that comes apart near the cursor, a scroll-lit four-layer stack, isometric feature art, a dark metrics band with a 3D bar chart, extruded pricing and a grid you can stack blocks on.
- [Marshal — Rail Yard Automation Landing](https://www.assembli.design/components/marshal-landing.md): AI-operations template drawn as an isometric rail yard: a live hero where cargo rolls into a signal box and is switched onto the line for each tool, standing UI panels, five live reliability drawings, use-case yards, couplings around a glass signal box, fares, FAQ and a semaphore CTA.
- [Isoline — Vector Database Landing](https://www.assembli.design/components/isoline-landing.md): Developer-platform template for a vector database, printed as a survey map of meaning. A contour-map hero where a dropped query pin finds its nearest records, tabbed install snippets with live output, a cost estimator with a log-scale chart, Atlas as two routes to one answer, a console with metrics, record browser and namespaces, architecture steps, uptime and a map-collar footer.
- [Alder — Agentic CRM Ledger Landing](https://www.assembli.design/components/alder-landing.md): Landing template for a fictional agentic CRM, set as a printed ledger on warm paper. People write in black serif; the agent edits in red mono ink: a live pipeline it strikes through and rewrites, a scroll-driven night log, redlines you accept, an autonomy setting, footnoted figures, a menu-style price list and a signature-line sign-up.
- [Orrery — SaaS Landing Template](https://www.assembli.design/components/orrery-landing.md): Reusable SaaS landing template for a fictional orchestration platform. A draggable 3D orrery hero that tilts top-down as you scroll, a scroll-pinned exploded layer stack, a spotlight bento with a dot globe and live micro-demos, a code runner, warp-tunnel CTA and more. Pass content, accent colors and section order as props.

## AI products

> Model-powered tools: generators, assistants, copilots and agents.

- [Kestrel — AI Growth Agent Landing Page](https://www.assembli.design/components/kestrel-landing.md): A light landing page for an AI growth agent, illustrated with gouache landscapes painted in SVG: a coast hero with live channel pins and a typing composer, scroll-lit copy beside four product views, an overnight board with a replay scrubber, a connector flow, team tabs, customer postcards, pricing and a harbour CTA.
- [Timbre — Voice AI Assistant Landing Page](https://www.assembli.design/components/timbre-landing.md): A pitch-black landing page for a voice AI assistant: decoding pixel keywords, a live spectrum analyser hero behind a working composer with a listening mode, timecode rulers with a scroll playhead, radial voice orbs, a self-filling meeting notes panel, a two-card bento, a usage slider that picks your plan, a two-column FAQ and a hold-to-talk call to action.
- [Vesper — AI Agent Cloud Landing Page](https://www.assembli.design/components/vesper-landing.md): A dusk-gradient landing page for an AI agent cloud in a blueprint frame: a point-cloud crystal that leans toward the cursor, a rippling halftone arc, a rolling logo wall, a scroll-lit quote, a live terminal, a feature bento with a fork-and-merge race, a use-case carousel, a scrubbable quota chart, a story pager, an integrations hub and a sunrise call to action.
- [Marigold — AI Automation SaaS Landing Page](https://www.assembli.design/components/marigold-landing.md): A warm marigold landing page for an AI back-office automation platform: a grid hero with travelling light pulses, a live metrics bento with a gliding bar chart and spinning globe, an auto-advancing industry accordion that re-plots a dashboard, animated how-it-works cards, a pricing switch, a story carousel and a self-shuffling agent roster.
- [Facelet — AI Site Builder Landing](https://www.assembli.design/components/facelet-landing.md): Toy-plastic landing page for a fictional AI website builder, built around a working Rubik's cube in CSS 3D that turns and solves itself as a log ticks through six build stages. Plus a product board, a host/export panel that turns like a cube face, a self-folding cube net, a 20-move build log, a leaderboard and scrollable demo sites.
- [Calyx — AI Platform Landing](https://www.assembli.design/components/calyx-landing.md): AI platform template printed as a botanical field guide: a wireframe lotus hero that blooms and turns, four live product panels (policy toggles, one answer in five channels, cited retrieval, an eval chart), roots that grow into data sources, a variant tree you prune with a slider, growth rings, herbarium-sheet testimonials, usage pricing and a seed-packet CTA.
- [Borea — AI Agent Platform Landing](https://www.assembli.design/components/borea-landing.md): AI-agent platform template lit like an aurora: violet and mint streaks over a live prompt box and app, a bento, a chat workspace that replays threads, crews, stacked feature cards with a working command palette, a four-tab product tour, an integrations wall over a glass sphere, stories, steps, FAQ and an aurora footer.
- [Stratum — AI Context Layer Landing](https://www.assembli.design/components/stratum-landing.md): AI context-layer template told as geological strata. An isometric core-sample hero with a scrubbable time ruler, chamfered problem cards, a stale snapshot beside a live record that rewrites itself, a cited answer with source popovers, a connector field, a compounding-value chart, a scope/monitor/audit security console and a use-case carousel.
- [Parhelia — AI Agent Platform Landing](https://www.assembli.design/components/parhelia-landing.md): Enterprise AI-agent platform template built from atmospheric optics. Light pillars and a rising sun with its halo and sun dogs over a live ops dashboard, a scroll-lit manifesto, a bento with a prism and draggable dials, a sticky platform tour, solution tabs, stacked steps, 3D security plates, results carousel, pricing, FAQ and a horizon wordmark.
- [Bloomprint — AI Image Darkroom Landing](https://www.assembli.design/components/bloomprint-landing.md): Landing template for a fictional AI image generator, set as a photographic darkroom. A wheel of prints turns above a light-leak prompt box that develops new ones, then expose-develop-fix steps, a bento with a compare slider and film looks, a scroll-lit manifesto, a safelight pricing room and prints drying on a line.

## Product launches

> Hardware, gadgets, apps and consumer products with a launch story.

- [Tine — Pocket Synthesizer Launch](https://www.assembli.design/components/tine-landing.md): Product launch page for a fictional pocket synth. The hero device is a working instrument: a Web Audio step sequencer with draggable knobs and a live scope. Then a scroll-driven exploded view, four sound engines drawn on canvas, colour swatches with a circular wipe, playable artist patterns, odometer specs, pre-order, FAQ and a strummable footer logo.

## Portfolios

> Personal sites for designers, developers, photographers and other creatives.

- [Brandt — Split-Screen Product Designer Portfolio](https://www.assembli.design/components/brandt-folio.md): A cool cobalt split-screen portfolio: a sticky intro with a live clock, a headline whose scrambled word tidies up on hover and a scroll-following work index, beside live case studies (an onboarding flow that types its own code, a money app, a sales dashboard, fitness screens, a launch site), a cursor pill, a floating nav and a contact footer.
- [Abara — Booking-Calendar Brand Designer Portfolio](https://www.assembli.design/components/abara-folio.md): A bright, outlined brand designer portfolio: a bubblegum hero with a live clock beside a booking calendar whose open months you can pick, project cards that tilt with a cursor pill, priced services you add to the brief, a process strip, an about card, tilted kind words and a brief form that remembers your picks.
- [Arvidsson — Bento Designer Portfolio](https://www.assembli.design/components/arvidsson-folio.md): A dark bento-grid portfolio for a product designer: a portrait hero with a working light/dark toggle, count-up stats, a featured project with a tilted live dashboard you can page through, a drifting tool marquee, an auto-playing testimonial carousel, a work timeline, services, a turntable card whose record spins as it plays through a queue and a reach-out card with copy-to-clipboard email.
- [Marlow — Minimal Designer Portfolio](https://www.assembli.design/components/marlow-folio.md): A quiet one-column designer portfolio: a floating icon rail that tracks the section in view (a bottom dock on phones) with a ⌘K jump palette, a hero with a live local-time city chip, copy-to-clipboard email and an unfolding bio, a featured side project drawn as a tiny live app, an expandable writing list, a tool stack with real app marks, and newsletter and contact forms with sent states.
- [Halden — Product Designer Portfolio](https://www.assembli.design/components/halden-folio.md): A light product designer portfolio lit by the designer's own sky: the pastel aura and project backdrops follow the time of day in Copenhagen, with a sun dial that scrubs the light. Live UI mockups play on hover in a grid or index view, plus three playable lab interactions, an experience list, a contact card with bookable slots and a floating dock.
- [Vandermeer — Design Engineer Portfolio](https://www.assembli.design/components/vandermeer-folio.md): A dark design engineer portfolio laid out like a desk: a cobalt cutting-mat hero with a die-cut sticker name, highlighted intro, tilted pill links, a studio photo, grid-paper notes and a playable mixtape, then scribbled client logos, photo case studies with a cursor pill, parallax UI details around a phone and a code-syntax sign-off.
- [Stickwork — Brand Designer Portfolio](https://www.assembli.design/components/stickwork-folio.md): A brand designer's portfolio printed as a die-cut sticker sheet on a cutting mat: a hero whose stickers peel off and drag, leaving their kiss-cut outlines behind, packing-tape marquees, project cards that show each identity as its own sticker sheet, service cards you peel back for pricing and a laptop lid of stickers.
- [Concertina — Folding Book Portfolio](https://www.assembli.design/components/concertina-folio.md): A sound designer's portfolio printed as a concertina book: scrolling unfolds the panels in 3D one spread at a time, a top-down fold diagram tracks your place, and at the end the book closes onto a contact back cover.
- [Palmline — Mobile App Designer Portfolio](https://www.assembli.design/components/palmline-folio.md): A portfolio for an independent app designer, built on 'made for the hand it's held in': a reach inspector that overlays thumb zones on live phone screens and checks the primary action, project stages with working app UIs, a settings-style CV, service specimens, testimonials as a Messages thread and a slide-to-book call to action.
- [Artboard — Multiplayer Canvas Portfolio](https://www.assembli.design/components/artboard-folio.md): A designer portfolio built as a live design file: a ruler that measures whatever you hover, a name layer with working resize handles that drive a variable font, roaming collaborator cursors you can follow, stacked case-file folders, a version-history career log and a Truchet-tile playground.

## Agencies & studios

> Design, development and marketing agencies, studios and consultancies.

- [Retort — Frontier Science Studio Landing Page](https://www.assembli.design/components/retort-landing.md): An airy landing page for a brand studio serving frontier science companies. A glass DNA double helix with fluorescent liquid flowing through it is raymarched live in WebGL with real refraction and choreographed by scroll: an arch under the hero, a column beside a word-by-word statement, a beam behind frosted client slides, a pinned four-stage method, then a plasmid ring around the CTA.
- [Updraft — AI Operations Studio Landing Page](https://www.assembli.design/components/updraft-landing.md): A photographic sky landing page for an AI operations consultancy: a lavender cloud-sea hero with a draggable 3D ring of live widget cards, a logo marquee, a statement that fills in as you scroll, a stat bento with live office clocks, service cards that expand into photos, animated expertise mockups, a pricing toggle, a testimonial rail, field notes and a wind-farm call to action.
- [Halyard — Recruitment Agency Landing Page](https://www.assembli.design/components/halyard-landing.md): A departures-board landing page for a recruitment agency: a live split-flap roles board with desk filters and a colleague's cursor, a diagonal employer/candidate split, boarding-pass marquees, sector desks, a scroll-driven week, draggable role cards, flap counters, a tile wall that reveals the team, a page-turning salary guide, FAQs and a flap wordmark footer.
- [Wren — Retention Consultancy Landing Page](https://www.assembli.design/components/wren-landing.md): A soft, photographic landing page for a subscription-retention consultancy: a painterly flower hero with a rotating case readout, a scroll-lit statement, a before/after reveal that splits its headline, a switchable results chart, stacking service cards, a self-advancing phase accordion, a team roster, a dark plan picker, tabbed FAQs and a working contact form.
- [Heddle — AI Automation Studio Landing](https://www.assembli.design/components/heddle-landing.md): AI-automation studio template cut like a denim mill: threads run through the hero CTA and are woven into selvedge cloth as you scroll, punch-card section bars, a live Loom dashboard, an agent you can thread, hanging-thread stats, auto-advancing process tabs, woven swatch covers, pricing, an approvals phone and an FAQ.
- [Nightjar — AI Automation Studio Landing](https://www.assembli.design/components/nightjar-landing.md): Agency landing template told as one night shift. A 24-hour shift dial hero, a drag-to-spin client cylinder, a sunrise manifesto, a zoom through the headline into a live night log, expanding service panels with working mocks, a scroll-drawn process, cursor-lit case studies, a printed morning report, orbiting agents, pricing with a payback slider and a moon CTA.
- [Scorewell — Performance Marketing Studio Landing](https://www.assembli.design/components/scorewell-landing.md): Agency landing template built around a scoreboard. The hero is a live budget router that flips between spray-and-pray and ROAS-weighted spend, then a scroll-lit manifesto, service dashboards (funnel, budget moves, creative test, incrementality chart), a receipts bento, sticky case-study stack, a weekly-plays carousel, a home-vs-away comparison and a marquee CTA.

## Health & wellness

> Clinics, dentists, therapists, gyms and wellness brands.

- [Ninety — Blood Sugar Awareness Landing](https://www.assembli.design/components/ninety-landing.md): Blood-sugar screening template built on the A1c's 90-day memory: a raymarched frosted sugar crystal with a glowing honey core over a 90-day reading strip, a scroll-drawn decade of silent drift, a red-cell explainer with an A1c converter, a post-meal curve you flatten with four levers, a six-question risk check, a ranges table with unit toggle, testing routes, an FAQ and a closing crystal.

## Finance

> Fintech, banking, accounting, insurance and investing.

- [Quarter — Business Account Landing Page](https://www.assembli.design/components/quarter-landing.md): A bright fintech landing page built on the slice: incoming payments split into four coins that fly to their pots over a turning ring, a pinned track of line-art cards that lean as you scroll, a bento with a pickable split and a self-screening transfer, Quarter/Half/Whole pricing with rolling digits, a story deck you can throw and a ring call to action.
- [Tilly — Everyday Banking Landing Page](https://www.assembli.design/components/tilly-landing.md): A graphite fintech landing page with a lime highlighter and a receipt motif: a dashboard that tilts flat on scroll, a live feed that translates bank-speak, a receipt that prints, slide-to-send, draggable envelope limits, reviews on receipts, a card you can freeze, perforated pricing and a card you can flip.
- [Cheeks — Meme Coin Landing](https://www.assembli.design/components/cheeks-landing.md): Meme coin template starring Hamlet, a raymarched vinyl-toy hamster whose eyes follow the cursor. Click to feed him coins until his cheeks burst, then try six skins. Below: an ID card, a fanned deck of trading cards, a working swap widget, a tokenomics donut, a burrow roadmap drawn as you scroll, a meme maker that exports PNGs and a chat FAQ.
- [Tare — Month-End Close Landing](https://www.assembli.design/components/tare-landing.md): Month-end close template on cool ledger paper: bank lines ride lanes into a glazed cobalt key you press to close the month, a statement that inks itself beside a stat ledger, one app window with four working views, the close hour by hour, a matching board with drawn connectors, a connector keyboard, a verifiable audit trail, pricing and an FAQ.
- [Sextant — Insurance AI Landing](https://www.assembli.design/components/sextant-landing.md): Insurance-operations AI template on one field of 70,000 glowing particles that reshapes as you scroll: a tree rising from rippling water, a turning wireframe cube with the wordmark inside, a shield beside a filterable decision ledger, a calm pool of rings behind outcome stats, then the tree again. The pointer parts the particles. Raw WebGL, no three.js.
- [Assay — AI Finance Analyst Landing](https://www.assembli.design/components/assay-landing.md): Finance-AI template where every answer comes back hallmarked with its source: brushed-brass ingots, coin-milled buttons, a working finance workspace with an Ask panel, sticky capabilities with live panels, connectors stamped as they pass the seal, dark use cases on a tick ruler, expanding stories, a hoverable growth chart, minted security coins, MCP and API, and an FAQ.
- [Obverse — Business Banking Landing](https://www.assembli.design/components/obverse-landing.md): Business-banking template printed like currency: a hero banknote that tilts, shimmers its foil and shows a watermark when held to the light, a working ledger, a security leaflet where a loupe glides to each printing feature as you scroll, a card issuer, a treasury certificate whose coupons clip themselves, a cheque that writes amounts in words, notes in six inks, pricing and an FAQ.

Back to [all components](https://www.assembli.design/components.md).