Obliq is a production-ready template for design studios, creative agencies, brand consultancies and independent designers who want a portfolio that argues its case and a shop attached to it. Built on Next.js 16, React 19, Tailwind CSS v4 and TypeScript, it ships 18 page templates covering a twelve-project portfolio, a ten-article filterable blog, a twelve-product shop with add-to-cart, per-plan pricing pages and a cart-aware checkout — no CMS or backend required.

Everything is self-hosted: no external CDNs, no third-party fonts at runtime and no commerce backend lock-in. Design tokens live in a Tailwind v4 @theme block in one stylesheet, and every editable string — brand, navigation, footer, services, testimonials, pricing, FAQ, process, about, contact and products — lives in a JSON or MDX file under src/content, so you can re-skin and refill the whole site without touching a component.

Live demo: https://obliq-nextjs.waidastudio.com/

Tech Stack

Next.js 16 — App Router, React 19 server components, routes prerendered to static HTML
Tailwind CSS v4 — @theme configuration in src/app/globals.css, no separate config file
TypeScript — strict mode, fully typed
MDX content — blog posts and project case studies via next-mdx-remote
Self-hosted fonts — Inter Tight and Inter through next/font, no runtime font CDN
JSON content layer — site, services, pricing, FAQ, process, about, contact and products as editable JSON
Client-side storefront — localStorage cart, no commerce backend wired

Included Pages and Templates

Home — hero video, projects, services, testimonials, pricing, FAQ, process and blog
About — team, founders, values, awards and testimonials
Service — service detail with process steps and its own FAQ
Project — a twelve-project index plus an MDX case-study template on /project/[slug]
Blog — a filterable ten-post directory plus an MDX article template on /blog/[slug]
Pricing — pricing page plus a per-plan detail route
Shop — a filterable twelve-product list plus product detail pages with add-to-cart
Storefront — cart-aware checkout and order confirmation (UI only, no payment processing)
Contact — contact details and enquiry form
Utility — Style Guide, License, Changelog, 401 (password)

18 page templates.

Easy Content Editing

No CMS needed — all editable content lives under src/content:

site.json — brand, navigation, footer columns, contact details and brand logos
services.json / service-page.json — homepage service cards and the service detail page
pricing.json / pricing-page.json — plans used on the home and pricing pages
testimonials.json, stats.json, faq.json, process.json — homepage social proof, FAQ and process
about.json / contact-page.json — the about page and the contact hero plus form schema
products.json — shop products: name, price, features and image
projects/*.mdx and blog/*.mdx — case studies and articles; adding a file adds a page
Theme — design tokens in the Tailwind v4 @theme block at the top of src/app/globals.css

Performance and SEO

Static-rendered pages out of the box (App Router), including every project, article and product page
Lazy-loaded imagery throughout with responsive srcsets
Self-hosted fonts — no third-party CDN requests at runtime
Per-page titles and metadata via the Next.js Metadata API, with Open Graph and Twitter cards
Semantic HTML structure, a single H1 per page, a route-aware active navigation state, and clean, crawlable URLs
Keyboard-navigable filters, menus and accordions, and every animation respects the reduced motion setting

Deployment

One-click deploy to Vercel — build settings are auto-detected. Also runs on Netlify, AWS Amplify, Cloudflare Pages, or any Node 20+ host.

What You Get

Full Next.js 16 + Tailwind CSS v4 + TypeScript source code
18 page templates covering the portfolio, blog, shop, pricing and checkout flows
Content collections: 12 projects and 10 articles as MDX, plus the whole site copy as JSON
A working cart and checkout flow, ready to point at your payment provider
Self-contained HTML documentation
Comprehensive README with setup and editing guide
Friendly buyer support

Requirements

Node.js 20 or higher
Basic familiarity with the command line
A text editor (VS Code recommended)

Obliq - Next.js 16 Design Studio Template with Storefront