Official landing page for OpenOctopus — AI family home hub.
| Layer | Choice |
|---|---|
| Framework | Astro (static output) |
| Styling | Tailwind CSS v3 |
| Images | Astro Image (sharp, auto WebP) |
| Fonts | Inter, JetBrains Mono, Noto Sans SC (Google Fonts CDN) |
| Deploy | Vercel + GitHub integration |
| Domain | openoctopus.club |
pnpm install
pnpm dev # localhost:4321
pnpm build # static output → dist/
pnpm preview # preview built site
src/
├── assets/brand/ # Logo, mascot, banner, generated images
├── assets/architecture/ # Architecture diagrams
├── assets/infographics/ # Infographic images
├── components/ # 16 Astro components (14 sections + Header/ThemeToggle)
├── layouts/Layout.astro # Base HTML with SEO meta, OG, fonts, theme init
├── pages/index.astro # Single-page landing (assembles all components)
└── styles/global.css # Tailwind base + brand utilities (.card, .btn-*, .gradient-text)
Hero → Three Metaphors → Realm Matrix → Summon → How It Works → Features → Comparison → RealmHub → Quick Start → Architecture → Ecosystem → Octo → Community → Footer
Dark-first (deep sea). Light mode via toggle. Uses custom Tailwind light: variant.
Brand colors: #0D1117 Abyss · #6C3FA0 Purple · #00D4AA Cyan · #1E3A5F Ocean
MIT