Zutra Cinematic — Astro 7 Portfolio Template for Visual Creators

Construido con

Astro 7 + Tailwind v4 / TypeScript / Static — no server required / Vercel · Netlify · Cloudflare Pages · VPS / Node 22.22+ · pnpm

0

A cinematic dark portfolio for visual creators who take craft seriously. Built on Astro 7 and Tailwind v4 — zero compromises on performance, zero runtime JavaScript where it isn't needed.

What's included

• Full portfolio section with project pages, gallery, categories, tags, and credits
• Journal section with articles, categories, tags, RSS feed, and per-article OG images
• Full-screen cinematic mobile navigation with staggered link animation
• Runtime accent color switcher with 5 presets — persists across navigations
• Server-rendered Open Graph images for every page via Satori (no Puppeteer)
• Self-hosted fonts via @fontsource — no Google Fonts requests, no FOIT
• Film grain overlay, smooth scroll (Lenis), stagger reveal animations
• Cookie consent + Google Analytics 4 or Plausible — privacy-first, fires after consent
• Dismissable top banner for promotions and announcements
• Zod-validated content collections — frontmatter errors caught at build time, not runtime
• JSON-LD structured data (Person, CreativeWork, Article) on every relevant page
• /llms.txt and /llms-full.txt for AI search engine visibility
• Complete documentation dashboard included at .docs/index.html
• Fully static output — deploy to Vercel, Netlify, Cloudflare Pages, or any static host

Performance

Lighthouse 100/100/100/100 target. Under 5kb of JavaScript shipped on the homepage. AVIF images with responsive widths. Prefetch on viewport enter — instant navigation on mobile and desktop.

Stack

Astro 7 · Tailwind v4 · TypeScript · Lenis · Satori · Sharp · @fontsource

Requirements

Node 22.22+ · pnpm (or npm/yarn)