Obliq — Next.js 16 Design Studio Template

Obliq is a premium, production-ready template for design studios, creative agencies, freelancers, and portfolio sites. Built from the ground up on Next.js 16, React 19, Tailwind CSS v4, and TypeScript, it ships with 15+ pre-built page templates, an MDX-powered blog and project system, a working shop with cart, and a fully editable content layer — no CMS or backend required.

Every piece of content lives in JSON or MDX files, so you can launch a real client site in hours without touching the component code.

Tech Stack

• Next.js 16 — App Router, server components, edge-ready
• React 19 — latest concurrent features
• Tailwind CSS v4 — modern @theme token config
• TypeScript — strict mode, fully typed
• MDX — for blog posts and project case studies via next-mdx-remote
• Self-hosted fonts — Inter Tight and Inter loaded via next-font-google (the Next.js Google font loader)
• Zero backend lock-in — no third-party CDN, no commerce backend dependency

Included Pages and Templates

• Homepage — hero video, project grid, services, testimonials, pricing, FAQ, process, blog feed
• About — team, founders, values, awards, testimonials
• Service — service detail with process and FAQ
• Contact — contact info and form
• Projects — listing page plus 12 MDX case studies with detail template
• Blog — filterable listing plus 10 MDX posts with detail template
• Pricing — pricing overview plus per-plan detail pages
• Shop — 12 products with filtering and product detail pages
• Checkout and Order Confirmation — cart-aware flow (no real payment wired; UI demo)
• Utility — style guide, license, changelog, 401 error

Easy Content Editing

All editable content lives in the project's src content folder — you never have to touch component code to launch the site. Update these files in any text editor:

• site.json — brand, navigation, footer, contact info, brand logos
• services.json, service-page.json — services and service detail
• testimonials.json, stats.json — social proof
• pricing.json, pricing-page.json — pricing plans
• faq.json, process.json — FAQ and process steps
• about.json, contact-page.json — about and contact pages
• products.json — shop products
• projects and blog MDX files — case studies and articles

Performance and SEO

• Server-rendered pages out of the box (App Router)
• Optimized images via the Next.js Image component
• Self-hosted fonts — no third-party CDN requests at runtime
• Semantic HTML structure
• Clean, crawlable URLs

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 and TypeScript source code
• 15+ pre-built page templates
• Sample content (12 projects, 10 blog posts, 12 products)
• 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)