Nuxt Framer docs

Everything you need to go from template to a live site on your domain.

Start a site

Create an account, name your team and pick a template. The editor opens with the site ready to change.

Click a layer to select it; double-click goes one level deeper and edits text in place, ⌘-click picks the innermost layer. Drag sections from Insert onto an artboard, or pick a tool and draw: F for a frame, T for text, I for an image.

Desktop is the base. Change something on the Tablet or Phone artboard and only that size and smaller change; a blue dot in the Design panel marks it, and clicking the dot inherits again.

Theme and tokens

Layers use design tokens by name, such as primary, muted or muted-foreground, the same names as shadcn. Pick a preset or two palettes in the Theme tab, then set any token exactly.

Export globals.css to use the same look in a Tailwind v4 codebase; Nuxt UI class names such as text-muted and bg-elevated work too.

Publish and versions

Publish puts every page, the shared layout and the theme live as a new version. Your site is on its free address (name.nuxtframe.com) right away.

Settings → Versions lists every publish. Restore makes an older version live again without touching your drafts. Preview (the play button) shows drafts before you publish.

Custom domains

Upgrade the project to Pro or Business, open Settings → Domains and enter your domain, like www.example.com.

Add the CNAME (and TXT records, if shown) at your registrar and press Check DNS. HTTPS is issued automatically. Make it primary so links and search engines use it.

Teams

Everyone in a team can edit and publish its projects. Owners and admins also manage billing, domains and teammates.

Invite people from Team. They get a link that works for 7 days for the invited email. Teammates are free on every plan.

Plans and billing

Plans are per project. Change a project’s plan in Settings → Plan and billing; invoices and payment methods live in the billing portal.

If you cancel, the site keeps running on its free address with Free plan limits.

For developers

Nuxt Framer is a Nuxt 4 app on CloudConfig and Cloudflare. Clone it, run pnpm install, pnpm db:migrate and pnpm dev, then open localhost:3000. Sites are served on name.localhost:3000.

Coding agents: Claude Code users run /plugin marketplace add dennisadriaans/nuxt-framer and /plugin install nuxt-framer@nuxt-framer. Codex and Cursor read AGENTS.md and .agents/skills. The bundled MCP server (pnpm mcp) exposes the project’s models to your agent.

To run your own platform, set the variables in .env.example (app and sites hosts, Stripe, Cloudflare for SaaS, OAuth) and deploy with pnpm run deploy (cloudconfig deploy).