Spark
Friendly app landing page with phone mockups and playful violet accents. Perfect for consumer apps.
See Spark in action
Every page and section is part of the download. Use these as launch-day templates — keep the structure, swap the copy.
Spark is built for mobile apps, consumer products, and SaaS tools that need a friendly, approachable landing page. The phone mockup hero, playful violet accents, and rounded everything make your app feel inviting.
Best Fit For
- Mobile app startups
- Consumer products
- SaaS tools
- Productivity apps
- Social platforms
- Health & fitness apps
Full Page Set
Every page is real and editable — no placeholders, no "coming soon" stubs.
27 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
Phone Mockup Hero That Sells
The hero drops your app screenshot into a realistic phone frame against a soft gradient background. Visitors immediately understand what your product looks like — no guesswork, no stock photos, just your app front and center.
Designed to Feel Friendly
Every corner is rounded, every shadow is soft, every transition is smooth. Spark uses generous white space and playful micro-interactions to make your landing page feel warm and approachable — the opposite of intimidating enterprise software.
Conversion-Focused Download Section
The download section includes platform badges, QR codes, and a feature recap. It is designed to be the last nudge a visitor needs, positioned after social proof and features so they arrive ready to tap install.
Forms, newsletter, and analytics — pre-wired
Spark 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 Spark-specific page — all live now.