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.

Dario Martinez
Screenshots






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
-
Unzip the file
-
cd blog && npm install
-
cp .env.example .env.local → fill in your Sanity project ID
-
cd ../studio-blogsite && npm install && npm run dev
-
cd ../blog && npm run dev