Shield
Minimal security-focused SaaS theme. Near-grayscale with surgical yellow-green accents.
See Shield in action
Every page and section is part of the download. Use these as launch-day templates — keep the structure, swap the copy.
Shield is for security companies, infrastructure tools, and data platforms that need to communicate trust without visual clutter. The near-grayscale palette with surgical yellow-green accents says 'we take this seriously.'
Best Fit For
- Security companies
- Infrastructure tools
- Data platforms
- Compliance software
- DevOps products
- Enterprise SaaS
Full Page Set
Every page is real and editable — no placeholders, no "coming soon" stubs.
32 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
Trust Through Restraint
Shield strips away decorative elements that dilute credibility. The near-grayscale palette and tight typography create a visual language of precision and control — exactly what security buyers expect from a vendor they are about to trust with their data.
Solutions That Speak to Buyers
The solutions page lets you segment by industry or use case, so each visitor sees themselves reflected in the product. Cards link to detailed solution pages with challenges, features, and case study excerpts.
Surgical Accent Strategy
Yellow-green accents appear only where action is needed — primary CTAs, status indicators, and key navigation. This creates a visual hierarchy so clear that visitors always know exactly where to look next.
Forms, newsletter, and analytics — pre-wired
Shield 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 Shield-specific page — all live now.