Next16 Claude Starter workflow
Next.js 16 starter for animated landing sites: an Obsidian rules vault, Claude Code hooks and agents for sections, SEO and motion
- 146 ★ on the repository
- Last commit
- Unlicense
Minimal access
Why this level
- Claude Code hooks run commands on every agent turn, so read them before starting
- The template pulls many dependencies and versions need checking before release
Install
- Works in
In your terminal, with SkillFoxx CLI
npx skillfoxx add workflows/next16-claude-starterDetects the agents on your machine, shows the access level and pins the version.
Other ways to install
Access and checks
How we reviewMinimal accessThe tool runs nothing and makes no network calls.
- Claude Code hooks run commands on every agent turn, so read them before starting
- The template pulls many dependencies and versions need checking before release
This is third-party code. Review the repository files before installing.
What it does
Next16 Claude Starter is a Next.js 16 project template for animation-heavy marketing sites. The Textura agency built it so that Claude Code and Cursor produce clean code on the first pass. Animations run on `@react-spring/web` springs, text goes through `spring-text-engine`, Lenis smooths scrolling, styling is Tailwind v4 and a rem-based adaptive grid scales the layout. The README names the main value: a documentation and enforcement system around the template. An Obsidian vault holds all project rules, and three hooks in `.claude/settings.json` make the agent read it before work and update it afterwards: `SessionStart` points to the vault, `UserPromptSubmit` reminds the agent to consult the right guide and `Stop` blocks finishing once to check that the vault was updated. The `.claude` folder holds the `motion-reviewer`, `section-builder`, `seo-auditor` and `vault-librarian` agents, commands such as `/new-page`, `/section`, `/seo`, `/perf`, `/qa` and `/ship`, rules for tokens, motion, routing and Supabase, and skills such as `aeo-visibility`.
Who it is for. Studios and freelancers who build animated Next.js sites with Claude Code or Cursor and want to pin project rules in the repository.
Good fit when
- You need to start a new Next.js 16 landing with ready spring animation
- The agent must read project rules every time and update them after changes
- Page sections are built by one agent and motion is reviewed by another
- You need ready commands for SEO, performance, QA and release
Not a fit when
- The project is not on Next.js or needs another animation library instead of `@react-spring/web`
- Hooks that force reading the vault get in the way of a quick one-off edit
- You need a minimal starter with no Obsidian, Payload or Supabase in the rules
Example request
Clone the starter, set up the project from scratch and add an About page with the /new-page command and a hero section on spring animationsLimitations
Node 22.13 or newer and the yarn package manager are required, and the template has to be copied into a clean folder with a fresh git history. The `Stop` and `UserPromptSubmit` hooks add steps to every agent turn and cost tokens. The rules assume a specific stack: springs, Lenis, Tailwind v4, Payload and Supabase. The license is Unlicense and the last commit is dated October 14, 2026. The set of commands and agents depends on the starter version.
How to disable. Open `/hooks` in Claude Code and turn off the three hooks or delete the `hooks` section from `.claude/settings.json`, then remove the `.claude` and `obsidian` folders if the starter is no longer needed.
FAQ
What does the starter include?
A Next.js 16 project with animations on `@react-spring/web`, Lenis, Tailwind v4, an Obsidian rules vault, hooks, agents and Claude Code commands.
What do the three hooks do?
`SessionStart` points the agent to the vault, `UserPromptSubmit` reminds it to consult the guide and `Stop` blocks finishing once to verify the vault update.
How do I disable the hooks?
Through `/hooks` in Claude Code or by deleting the `hooks` section from `.claude/settings.json`.
Which agents are in the starter?
`motion-reviewer`, `section-builder`, `seo-auditor` and `vault-librarian`.
Which Node version is needed?
Version 22.13 or newer, with dependencies installed by `yarn install`.
Discussion
No questions or reviews yet.
Related
WorkflowsClaude Web Builder takes a newcomer from a few business questions to a Next.js landing page with a Vercel URL, no code to write.
ai-site-cloner turns Claude Code or Cursor into a pipeline that clones a site to Next.js with measured styles and pixel checks.
A kit of skills, tokens and rules that turns Claude into a design architect: DTCG tokens, components, accessibility and objective quality gates
A workspace for Claude Code: ten commands lead from a product idea to React screens and a handoff package with ready prompts for implementation
The /awwwards skill for Claude Code: frontend art direction by Awwwards criteria, with typography, color, motion and WebGL.
A free Claude skill that writes a build spec, picks cinematic media, builds a landing page and checks it with screenshots
Comparison with similar tools
Cards that share the main search query, and how they differ.
| Tool | Official | Repository stars | Main difference |
|---|---|---|---|
| Next16 Claude Starter (this card) | no | 146 | |
| Next.js skills | no | 143,488 | a ready project with animation, a rules vault and hooks and not a set of Next.js skills |
| project-starter | no | 1,423 | a starter specifically for animated landings on Next.js 16 |
README in short
The README opens with a promise of clean code on the first pass and a start with one prompt for Claude Code or Cursor. The main part is about the documentation system: an Obsidian vault, three hooks and hard rules. Project structure and a step-by-step start follow.