Payload Starter

A Payload CMS + Next.js starter with a design layer on top of the official Website template.

Dark-first warm-ink palette, Fraunces serif display with variable-axis scroll scrubbing, Inter body, OKLCH tokens, smooth scroll, restrained motion, magazine-style post index. Built to ship from, not to redesign for a week.

Quick start

git clone https://github.com/Maxkrvo/Payload-starter.git my-project
cd my-project
cp .env.example .env
pnpm install
docker compose up -d   # starts MongoDB
pnpm dev

Open http://localhost:3000. Visit /admin to create an admin user, then click "Seed your database" on the admin dashboard.

Generate secrets in .env:

echo "PAYLOAD_SECRET=$(openssl rand -hex 32)" >> .env
echo "CRON_SECRET=$(openssl rand -hex 16)" >> .env
echo "PREVIEW_SECRET=$(openssl rand -hex 16)" >> .env

Stack

• Next.js 16 (App Router), React 19
• Payload 3 with MongoDB
• Tailwind v4
• Motion + Lenis
• Fraunces, Inter, JetBrains Mono

Customize

• Accent color: --accent in src/app/(frontend)/globals.css (two definitions, dark + light)
• Typeface: src/app/(frontend)/layout.tsx, keep the --font-display / --font-sans / --font-mono variable names
• Re-seed: fetch('/next/seed', { method: 'POST', credentials: 'include' }) from a logged-in browser console. Wipes all collections first.

License

MIT.