---
title: New
description: Scaffold a new VIBE21 site from an empty folder, then lock design and open a preview.
order: 1
---

# vibe21-web-new

Creates a new web from an empty folder. You answer a few questions. The technology stack is prepared for you.

Need Node.js and pnpm. If either is missing, run [vibe21-system-check](/docs/vibe21-system-check) first.

## When to use it

Use it once, at the start of a site, after [vibe21-system-check](/docs/vibe21-system-check).

The folder must be empty. Only `.git`, `.gitignore`, and `.DS_Store` are allowed. Do not run it on an existing VIBE21 project. Later changes go through the other skills, not a second scaffold.

## How to run it

```
/vibe21-web-new
```

The agent tells you the current directory will get a pinned Next.js app, then waits. Nothing is created until you confirm.

After the scaffold, it asks one question at a time. The first question is **agent language only**. Later questions are in that language.

- agent language — how the agent talks to you, not the website copy
- site name and short description — empty answers keep the VIBE21 defaults
- site languages — one or more; the first is the default locale. No locale routes are added.
- color theme — `single` or a light/dark `toggle`
- design style — Material, glassmorphism, flat, brutalism, or no specific style

## What happens

- A Next.js app is created at the pin (TypeScript, App Router, Tailwind, ESLint) plus `lucide-react`. The homepage says VIBE21.
- `vibe21.json` stores the answers. Theme, design, and languages are not applied to the generated UI yet.
- `vibe21.md` starts as the agent memory. VIBE21 rules are prepended to `AGENTS.md`.
- Layout title and description are overwritten only when you entered a name or description.

Then the agent offers [vibe21-design-configuration](/docs/vibe21-design-configuration). If you decline, it offers [vibe21-web-preview](/docs/vibe21-web-preview).