Contour
Industrial, motion-led Astro theme for technical SaaS, infrastructure software, field intelligence, and technology portfolios. Topographic surfaces, deployment case studies, platform architecture, SaaS pricing, journal, forms, and live signal-color switching.
One payment for Contour and everything else - all 27 themes, every future release, and the visual builder included.
See Contour in action
Every page and section is part of the download. Use these as launch-day templates - keep the structure, swap the copy.
Contour is a complete Astro website system for technical SaaS companies, infrastructure platforms, industrial technology teams, geospatial products, cybersecurity businesses, and other products that need to explain complex systems with precision. Its fixed topographic surfaces, near-black and mineral-white environments, condensed industrial display type, monospaced interface copy, rectangular controls, and signal-color accents establish a credible technical identity without falling back on familiar startup gradients. The experience is deliberately active: Lenis smooths page movement, GSAP coordinates the hero and viewport reveals, images transition from grayscale to color on hover, case-study cards alternate between narrow and wide proportions, marquees run continuously, and Astro page transitions preserve the visual rhythm between routes. The production build generates 16 pages, including a complete platform page, six deployment case studies, three Markdown journal articles, contact and legal routes, SEO output, and a custom 404. Shared identity, navigation, imagery, platform copy, pricing, deployment stories, galleries, forms, labels, legal content, metadata, and SEO live in src/config/site.ts, while long-form journal articles remain comfortable to edit as Markdown.
Best Fit For
- Technical SaaS and B2B software products
- Infrastructure, industrial, and operational technology
- Geospatial, field-intelligence, and mapping platforms
- Cybersecurity, observability, and developer tools
- Technology studios that need a credible deployment portfolio
- Complex products selling pilots, subscriptions, or enterprise plans
Full Page Set
Every page is real and editable - no placeholders, no "coming soon" stubs.
16 Sections Included
Every section is a ready-to-use Astro component. Add it to any page, customize via config, or remove what you don't need.
What's Included
A Technical Identity Without Generic SaaS Styling
Condensed display type, monospaced labels, fixed topographic linework, hard-edged controls, monochrome photography, and one controlled signal color make Contour feel engineered. The system works especially well when the product needs to communicate seriousness, scale, and operational credibility.
Product Story and Customer Proof in One System
The platform page explains how the system connects, resolves, operates, and remembers. The alternating deployment portfolio then proves that story across energy, mobility, ports, utilities, telecom, and public-sector use cases, with full generated case-study pages behind every card.
Motion Built Around Signals and Decisions
Scroll-linked hero movement, continuous marquees, viewport reveals, fixed topo surfaces, grayscale-to-color media, and coordinated hover states create a cohesive operating rhythm. Reduced-motion visitors receive stable, intentional layouts rather than a partially disabled experience.
Forms, newsletter, and analytics - pre-wired
Contour is ready to connect to your preferred providers. Pick from the options below, drop in a single API key, and your contact form, newsletter signup, and analytics are live - no backend, no JavaScript, no glue code.
Contact form
The Contact section's <form> renders with no JS. Set one provider in site.ts; the form action wires automatically.
- Formspree50 free submissions / month, no domain restriction
- FormSubmitFree, no signup - just an email confirmation
- Netlify FormsFree 100/month - Netlify hosting only
Newsletter
The Newsletter form sends subscribers directly to your ESP. The email input name auto-adjusts per provider.
- MailchimpStandard EMAIL field; honeypot supported
- ConvertKit (Kit)email_address field; works with any form ID
- Buttondownemail field; lightest, indie-friendly
Analytics
Layout.astro injects the right script tag based on the provider you choose. No client-side branching.
- Google Analytics 4Paste your G-XXXXXXXXXX measurement ID
- PlausiblePrivacy-friendly, ~1 KB script, no cookies
- UmamiSelf-hostable, also cookie-free
Tech Stack
Config-Driven Setup
Every theme uses a single src/config/site.ts file
for customization. Change your brand, navigation, form providers, analytics, and section content
without touching component code.
// src/config/site.ts
export const siteConfig = {
name: "Your Company",
tagline: "Your tagline here",
url: "https://yourdomain.com",
navigation: { sticky: true, links: [...], cta: {...} },
social: { twitter: "...", github: "...", linkedin: "..." },
seo: { title: "...", description: "...", ogImage: "/og.png" },
// ── Provider switches ────────────────────────────────
contactForm: { provider: "formspree", formspreeId: "your-id" },
newsletter: { provider: "convertkit", actionUrl: "https://..." },
analytics: { provider: "plausible", plausibleDomain: "you.com" },
// ── Section data ─────────────────────────────────────
team, video, timeline, comparison, gallery,
carousel, tabs, appDownload, map, footer,
} as const;Full documentation, ready before you buy
Browse the install guide, the site.ts reference, provider setup, deploy instructions, and the Contour-specific page - all live now.
More themes from the collection.
Tally
SaaS / Startup
Falcon
Agency / Portfolio / Blog
August
Personal / Portfolio / SaaS
Slab
SaaS / Startup
Or get every theme - these included - with the All-Access Pass.