Waida Studio
Formix - Astro 7 Theme for Creative Agencies and Design Studios
A portfolio site with a working storefront, and not one byte of framework JavaScript. Formix is a complete creative agency and design studio theme built on Astro 7. Every page pre-renders to static HTML, so it loads instantly and deploys anywhere — and it ships zero framework JavaScript, just one small vanilla script.
Live demo: https://formix-astro.vercel.app
WHAT'S INSIDE
23 page templates — 51 static pages per build: home, about us, work grid, case study, service list, service detail, careers board, job listing, blog, article, pricing, plan category, plan detail, contact, checkout, PayPal checkout, order confirmation, instructions, style guide, license, changelog, password (401) and 404
Portfolio — 9 case studies as Markdown, each with a client, country and live date, a full-width banner and a body written as three regions with the design's image gallery between them; the three featured ones stack on the home page and the other six fill the work grid
Blog — 10 articles as Markdown, filed under four category tabs, each with an author, a reading time, a card thumbnail, a banner and the pull quote the design drops mid-article; the two featured ones get the sticky strip under the tabs
Services and careers — 5 service pages, each a full structure rather than a document (a hero, six inclusions, five process steps, a cross-fading testimonial carousel and three lightbox videos), and a 4-role openings board where every row links to a full job listing
Commerce pages — three plans, each sold on two billing terms and each with its own product page and category page, plus a cart drawer, checkout, PayPal checkout and order confirmation with quantity editing, line totals, subtotals and validation that only tests fields a visitor can actually see (localStorage-based; wire up Stripe or Lemon Squeezy when you're ready to sell)
Motion that earns its keep — 437 scroll reveals at the design's own offsets and delays, fourteen scroll-linked timelines, a draggable work rail that also steps from the keyboard, a heading that lights up character by character, five carousels, fifty-five FAQ disclosures, seven tab sets, a video lightbox and cursor-following buttons — all in one vanilla script, all respecting prefers-reduced-motion
Edit content, not code — add a Markdown file with an order, and the listing, the card and the detail page all follow
Design-token system — the whole palette and type scale are 76 CSS custom properties in one :root block; change them there and every page follows
Self-hosted fonts — Inter Tight as a single variable woff2 covering weights 100–900, no CDN requests
Responsive imagery — every picture ships with the srcset rungs the design gives it, so it arrives at the size the slot actually needs
TypeScript throughout, zod-validated content schema
TECH STACK
Astro 7 · Markdown content collections · TypeScript · the template's own CSS — no utility framework, no build-time CSS pipeline
REQUIREMENTS
Node 22.12 or newer. npm ships with it. Nothing else to install.
LICENSE
One end product per license. You may modify the source freely; you may not resell, sublicense or redistribute it, in whole or in substantial part.
SUPPORT