Vireo is a premium realtime product analytics theme built on Astro 5, React, TypeScript, and Tailwind CSS v4. It ships with a complete shadcn/ui component library, a sleek dark-first design system with full light/dark mode toggle, and a content-collections architecture for blog posts, customer stories, team profiles, integrations, and more.

Vireo is built for SaaS founders, product teams, and marketing agencies who need to ship a polished analytics landing page fast — without sacrificing quality. Whether you're launching a product analytics tool, a data platform, or a developer-focused SaaS, Vireo gives you a production-ready foundation with real content architecture, not just a pretty mockup.

Live demo: https://still-resonance-348b.jacksonlittelmr.workers.dev/

This theme supports Astro version 5.x.

What's Included

• Homepage — Hero with animated dashboard mockup, feature grid, alerts section, funnel visualizations, bento cards, integrations marquee, pricing table with comparison grid, customer testimonials slider, and CTA sections

• About — Company story, responsive stats block, core values, investor logos, and team preview

• Blog — Paginated post index, tag-based browsing, featured post highlight, cover images, and individual post pages with SEO

• Customers — Customer stories index with image overlays, case study cards, and logo cloud

• Team — Team member index with portrait photos, individual profile pages with roles and bios

• Integrations — Integration directory with logo grid, individual integration pages with category tags

• Help Center — FAQ sections with categorized questions, searchable knowledge base

• Pricing — Dedicated pricing page with tier cards, feature comparison table, and recommended badge

• Changelog — Version history with dated entries and feature highlights

• Legal Pages — Privacy Policy, Terms of Service, and Cookie Policy

• Forms — Sign-in, register, and contact pages

• 404 — Branded error page

• RSS Feed — Auto-generated from blog posts

• Sitemap — Auto-generated for SEO

Tech Stack

• Astro 5 — Static-first, zero JS by default, partial hydration via React islands

• React Islands — Interactive components (pricing toggle, testimonial slider, nav menu, search) hydrate only where needed

• TypeScript — Type-safe components, content schemas, and data layers throughout

• Tailwind CSS v4 — Utility-first styling with a custom dark-first token system using CSS custom properties

• shadcn/ui — Accessible, composable UI primitives (Accordion, Avatar, Badge, Button, Card, Checkbox, Dialog, Dropdown Menu, Input, Label, Separator, Sheet, Switch, Tabs, Textarea)

• Astro Content Collections — Schema-validated collections for blog posts, customers, team, integrations, homepage sections, help center, changelog, and infopages

• Zod — Runtime content validation with TypeScript-inferred schemas

Dark-First Design System

Vireo uses a cohesive dark-first color palette built entirely on oklch CSS custom properties:

• Background: Deep charcoal (#09090b) — a rich, eye-friendly dark base

• Foreground: Pure white for maximum contrast on dark surfaces

• Accent: Electric purple (#a855f7) — vibrant highlights, CTAs, and interactive elements

• Secondary: Subtle gray (#1c1c1f) — cards, borders, and elevated surfaces

• Muted: Muted gray tones for secondary text, descriptions, and placeholders

The palette flips seamlessly into light mode with matched token overrides — backgrounds become near-white, text becomes dark, and the accent purple adapts for visibility. Toggle between modes with a single class swap on <html>.

Built-in Content System (Markdown)

Manage all content without touching layout code:

• Blog posts with cover images, tags, excerpts, and author attribution

• Customer stories with testimonial quotes, company names, and profile images

• Team member profiles with roles, bios, and portrait photos

• Integration listings with logos, descriptions, and category tags

• Homepage sections (hero, features, alerts, funnels, pricing, products, cards) — each in its own content file

• Help center articles organized by category

• Changelog entries with dates and version tags

Features at a Glance

• 15+ page types with full content

• Dark-first design with seamless light mode toggle

• 15 shadcn/ui components ready to use

• Animated hero dashboard mockup with realtime feed

• Responsive on all breakpoints (sm to 2xl)

• Testimonial slider, pricing toggle, and nav menu as React islands

• Content-managed homepage — every section editable via markdown

• SEO-ready with meta tags, Open Graph, sitemap, and RSS feed

• Typography powered by Inter, Inter Display, and Geist Mono

• Performance-optimized — zero layout shift, lazy-loaded images

Free Updates and Support

Vireo includes free lifetime updates to ensure compatibility with future Astro releases and ongoing performance improvements.