Every demo is a whole site
Not a home page with dead links. About, services, blog with real articles, pricing, contact, legal, 404 — every page a client asks for on the second call, already written and designed.
Every demo is a complete, hand-built site for a specific industry — home, inner pages, blog, legal pages, its own design system — as a Next.js 16 project with React 19, TypeScript and content in MDX and JSON. Pick the one that fits the brief and start editing.
1,504 finished pages · App Router, Server Components, TypeScript · Every route prerendered
Built for agencies, freelancers and busy studios
Not a home page with dead links. About, services, blog with real articles, pricing, contact, legal, 404 — every page a client asks for on the second call, already written and designed.
Next.js 16 with Server Components by default, one hand-written stylesheet and a handful of client components per demo. No Tailwind, no component kit, no animation package: React is the only runtime dependency.
Routes in src/app, content in src/content as MDX and JSON, colours and type as CSS custom properties at the top of one stylesheet. Learn one demo and you have learned all of them.
Deploys anywhere Next.js runs: VercelNetlifyCloudflareAWS AmplifyAny Node hostStatic export
In the package
Each card opens its demo in a new tab: the static export of the same project that ships in the download — the same routes, the same content, the same stylesheet.
40 of 40 demos
Creative Agency & Studio
Creative Agency & Design Studio
Creative Marketing Agency
Creative Agency & Design Studio
Digital Marketing Agency & Ecommerce
Marketing Agency & Creative Studio
Creative Marketing Agency
Creative Agency & Design Studio Ecommerce
Design Studio & Portfolio with Shop
Creative Agency & Design Portfolio Ecommerce
Creative Agency & Digital Studio
Creative Agency & Ecommerce
Creative Digital Agency
Creative Agency
Creative Media & Video Production Studio
Photography & Creative Studio
Creative Studio & Ecommerce
Influencer Marketing & Creator Agency
Influencer & Short-Form Video Agency
SaaS & Link Management
SaaS & Task Management
Fintech & SaaS with Checkout
Trading, Cryptocurrency & Finance SaaS
VPN, Privacy & Security Ecommerce
Fleet Tracking & Logistics SaaS
Sustainable Architecture & Real Estate
Architecture & Interior Design
Interior Design Studio
Real Estate & Property Ecommerce
Roofing & Construction Services
Roofing & Construction Ecommerce
Healthcare SaaS & Medical AI
Elderly Care & Medical
Skincare & Beauty Ecommerce
Eyewear & Sunglasses Ecommerce
Outdoor Gear Shop & Camping Trips
Sustainability & Green Services Ecommerce
Renewable Energy & Sustainability Ecommerce
Football Tournament & Sports Streaming
Golf Academy & Pro Shop Ecommerce
No demo matches that. Try a broader word, or clear the filter.
How it works
Filter the grid above by industry, open a few, choose the closest fit. Copy its demo-*/ folder out of the package — that copy is your project, with its own package.json.
Node 20 or newer. The dev server runs at localhost:3000; edit a page, a component or a content file and the browser refreshes.
Colours, fonts, spacing and radius are custom properties in the stylesheet's :root. The demo's style-guide page shows every one of them rendered.
npm run build prerenders every route. Push to Vercel, Netlify or Cloudflare, run it on any Node host, or export static HTML for a plain web server.
manifold-nextjs/
├── index.html ← this page
├── documentation.html
├── demo-architecture/ one complete Next.js project
│ ├── package.json · README.md · documentation/
│ ├── src/app/ one page.tsx per route
│ ├── src/content/ blog/*.mdx · *.json
│ ├── src/components/ header, footer, sections, cart
│ └── public/assets/
│ ├── css/styles.css tokens at the top
│ ├── fonts/ self-hosted WOFF2
│ └── images/
├── demo-photography/
├── demo-saas/
└── … 40 demos in all
Inner pages
Counted across the built package, so the numbers are real, not a promise.
Why Manifold
No Tailwind, no component library, no GSAP, no state manager. React is the only runtime dependency; one hand-written stylesheet and a handful of client components do the rest.
next build renders all 1,504 pages to static HTML, dynamic routes included. Deploy to Vercel, Netlify, Cloudflare or any Node host, or export a static folder.
Palette, type scale, spacing and radius live in one :root block per demo. Re-theme a whole site from there.
16 demos ship product pages, variants, a persistent cart, checkout and order confirmation as React components over one typed store. Connect your payment provider and go.
Scroll reveals, scroll-linked timelines, CSS marquees and keyboard-friendly dropdowns, each written to its design's own timings, re-run on client navigation and respecting reduced-motion.
Every family ships as WOFF2 inside the demo with an @font-face map. No Google Fonts call, no CDN, no third-party request.
Semantic markup, the Metadata API for titles, Open Graph and Twitter cards on every page, static delivery. Core Web Vitals are green before you write a line.
Setup, customisation and deployment questions are answered by the person who wrote the code, not a ticket queue.
Questions
Yes. The package is one folder with this page at the root and every demo in its own demo-*/ project folder, each with its own package.json. Nothing is shared between demos and nothing is fetched from anywhere else.
Each demo is its own design system with its own stylesheet, so sections are not drop-in interchangeable between demos. Pick the demo closest to the brief and customise it — every colour, font and spacing step is a token, and the copy is MDX and JSON.
One licence is one end product: your site or a client's, built from any single demo. Several sites means one licence per site. You may not resell or redistribute the source.
No. Content lives in src/content as MDX files with frontmatter and JSON, and every route prerenders at build time. Change a headline by editing a file; add a blog post by adding an MDX file — the listing, the detail page and the related posts update on their own.
The demos tagged Shop ship a working cart as React components over a typed localStorage store, with product pages, variants, checkout and order confirmation. Payment is where you connect your provider — the flow, the states and the markup are done.
Updates land in the same package. The changelog lists what changed, and each demo keeps its own CHANGELOG.md with its own history.
40 demos · 1,504 pages · one download
Forty finished websites for the price of one template.