Logo Forma

Forma

Back to marketplace

BlogSite — Next.js 15 Blog Template with Sanity CMS

**BlogSite** is a production-ready blog template built with **Next.js 15 App Router**, **Tailwind CSS v4**, **shadcn/ui**, and **Sanity CMS** — the exact stack professional developers use to ship fast, content-driven websites in 2025. It comes with a fully dark-mode UI featuring glassmorphism card effects, animated gradient orbs, vivid electric orange and hot pink accents, and a clean typographic system designed to make every post look editorial-grade out of the box. Whether you're a developer building your personal blog, a freelancer creating a content hub for a client, or an indie maker launching a newsletter-driven audience, BlogSite gives you a complete, opinionated foundation that skips the boring setup and goes straight to shipping. The template is deeply integrated with **Sanity CMS**, one of the most powerful and flexible headless content management systems available. The Sanity Studio ships pre-configured with a complete Post schema supporting title, slug, excerpt, rich body content via **Portable Text**, hero image with alt text, categories, tags, reading time, SEO title, SEO description, and featured post flag. BlogSite ships with five complete pages: a **landing home page** with a hero section, a stats strip, and a latest posts preview; a **full blog listing page** with real-time client-side filtering by category and keyword search across title, excerpt, and tags; an **individual post page** with a full PortableText renderer covering paragraphs, headings H1–H3, blockquotes, inline code, code blocks, bullet and numbered lists, embedded images, and links; an **about page** with author bio, topic cards, stack pills, products showcase, and social links; All pages are fully responsive. The entire content layer — every label, headline, CTA, description, and social link — is centralized in a single `src/lib/config.ts` file, so you can white-label and rebrand the template in minutes without hunting through component files. This template is ideal for developers who want a **Next.js Sanity blog starter**, a **dark mode blog template**, a **Tailwind CSS v4 blog**, or a production-ready **shadcn/ui blog template** without building everything from scratch.

Author | Dario Martinez

Dario Martinez

$49

Next.jsTailwind CSSShadcnUISanityCMS

Screenshots

Image of BlogSite — Next.js 15 Blog Template with Sanity CMS
Image of BlogSite — Next.js 15 Blog Template with Sanity CMS
Image of BlogSite — Next.js 15 Blog Template with Sanity CMS
Image of BlogSite — Next.js 15 Blog Template with Sanity CMS
Image of BlogSite — Next.js 15 Blog Template with Sanity CMS
Image of BlogSite — Next.js 15 Blog Template with Sanity CMS

BlogSite — Next.js 15 Blog Template with Sanity CMS

Modern dark-mode blog template built with Next.js 15, Tailwind CSS v4, shadcn/ui & Sanity CMS. Glassmorphism UI, ISR, PortableText. Production-ready.

What's included

When you purchase BlogSite you get a complete ZIP file with:

  • ✅ /blog — the Next.js 15 app (source code, ready to deploy)

  • ✅ /studio-blogsite — the pre-configured Sanity Studio

  • ✅ README.md — full setup and customization documentation

  • ✅ .env.example — environment variable reference

  • ✅ src/lib/config.ts — centralized content config for easy rebranding

What's NOT included in the ZIP: .next/, node_modules/, .git/, .env.local

Pages included

Home (landing)

Blog listing

Individual post

Sections included

Navbar: Navbar.tsx — sticky, glassmorphism, mobile menu

Hero: Hero.tsx — orbs, animated headline, stats, featured post

Latest posts: SectionBlog.tsx — asymmetric grid, 5 posts max

Blog grid: BlogPage.tsx — category filters + keyword search

Post detail: [slug]/page.tsx — full PortableText renderer

Footer: Footer.tsx — social links, nav, copyright

Tech stack

  • Next.js 15 — App Router, Server Components, ISR

  • TypeScript — fully typed throughout

  • Tailwind CSS v4 — CSS variables, no compiler required for colors

  • shadcn/ui — Badge, Button components

  • Sanity CMS — headless CMS with pre-configured schemas

  • @portabletext/react — full rich text rendering

  • Lucide React — icon system

  • Vercel — deploy in one click

Requirements

  • Node.js 18+

  • A free Sanity account (free tier is enough to start)

  • A Vercel account for deployment (free tier works)

Setup in 5 steps

  1. Unzip the file

  2. cd blog && npm install

  3. cp .env.example .env.local → fill in your Sanity project ID

  4. cd ../studio-blogsite && npm install && npm run dev

  5. cd ../blog && npm run dev