Olsa is a complete marketing website for founders and agencies shipping a software product rather than a brochure. It ships 28 pages, three content collections, and a three-layer token system you can rebrand by editing one file, all on eight runtime dependencies and 100% static HTML.
Built to launch a product site you can grow into
- Pricing with plans and a full comparison matrix, not a three-card strip
- The integrations directory is a real content collection: nine entries, each with a category, a rating, requirements, a logo glyph and its own detail route, sorted and featured from frontmatter
- MDX blog with hero images, categories, RSS, and authors resolved through a cross-collection reference, so a post that names a missing author fails the build instead of rendering a blank byline
- Sign-in and sign-up pages as real markup you can point at whatever backend you choose later, plus home, about, features, contact, privacy, terms and a themed 404
Everything is source you own
- 44 UI primitives and 8 content-aware cards, all tailwind-variants configs, plus 40 section components across 11 page groups
- 571 icons in a typed registry inlined at build time, so <Icon name="…" /> autocompletes and a wrong name fails type-checking rather than rendering nothing
- 87 animate-* utilities plus scroll-driven extensions, ported with no animation library, and a global prefers-reduced-motion guard the upstream doesn't ship
- The entire runtime manifest is eight packages: Astro, two Astro integrations, Tailwind and its Vite plugin, tailwind-variants, tailwind-merge, and one self-hosted variable font. No SEO plugin, no component kit, no icon package, no framework runtime
Zero JavaScript by default
- Interaction reaches for the platform first: <details> for disclosure, <dialog> for modals, the Popover API, scroll-driven animations, and @starting-style for enter transitions. A script ships only where nothing native covers the behaviour
- Builds to 100% static HTML with no host adapter required, so it deploys anywhere that serves files
- Light and dark set pre-paint by an inline script that reads localStorage defensively, so there's no flash of the wrong theme
- sharp optimizes every image at build, and the variable font is self-hosted rather than pulled from a CDN
Honest about the one thing it doesn't do
The contact form's schema, spam gates, escaping and Resend delivery path are all written, type-checked and self-checked, but the action ships unmounted, because mounting it means choosing a host adapter and the template stays deployment-neutral at 100% static HTML. Until you connect it, the form renders visibly disabled with a note saying so, rather than looking live and dropping messages into nothing. Connecting it is four steps, documented in the file itself with the security notes and a verification table.
SEO ready
Dynamic robots.txt, llms.txt for AI crawlers, an RSS feed, and a sitemap that filters noindex routes so it can never contradict the markup. Every meta and Open Graph tag emitted natively, plus typed JSON-LD builders for Organization, WebSite, Article and BreadcrumbList sharing a stable @id graph. Canonical URLs on one trailing-slash shape throughout.
