Nuxt Studio just went through its biggest transformation. The hosted platform at nuxt.studio is being sunset, and in its place is a free, open-source module you can self-host.

If you've been using Studio or thinking about using it, here's what changed and what it means for you.

The Shift to Open Source

When NuxtLabs joined Vercel in July 2025, they promised to make their premium products free and open source. They already did this with Nuxt UI, and now Studio is following the same path.

The old platform was a hosted service where you'd connect your GitHub repo and edit content through their interface. It worked, but you were tied to their infrastructure, their pricing, and their timeline for features.

The new approach is different. Studio is now a Nuxt module that runs alongside your app. Install it, configure it, and you're editing content in production. No third-party platform, no subscription, just a module in your project.

hero-section for nuxt studio website

What This Means for Development

Local Development Just Got Better

The old platform didn't work locally. You had to push changes to see them in Studio. The module changes that completely.

npx nuxi module add nuxt-studio

Run your dev server, and you'll see a floating button on the bottom left. Click it and you're in Studio, editing files directly in your local filesystem. Changes sync in real time. No commits, no waiting, just edit and save.

side content view for nuxt studio preview

For local development, that's all you need. The publish system (committing to GitHub/GitLab) only works in production, which makes sense. You're already using your IDE and Git workflow locally.

Production Editing Gets Simpler

In production, Studio lets non-technical people edit content without touching code or understanding Git. The setup requires two things : repository config and authentication.

Repository config tells Studio where to commit changes:

// nuxt.config.ts
export default defineNuxtConfig({
  studio: {
    repository: {
      provider: 'github', // or 'gitlab'
      owner: 'your-username',
      repo: 'your-repo',
      branch: 'main'
    }
  }
})

Authentication is handled through OAuth. You can use GitHub, GitLab, or Google:

# .env
STUDIO_GITHUB_CLIENT_ID=your_client_id
STUDIO_GITHUB_CLIENT_SECRET=your_client_secret

Or you can implement custom authentication (password, SSO, LDAP) using the provided utilities: setStudioUserSession and clearStudioUserSession.

Once deployed, navigate to /_studio and you're ready to get started. Login through OAuth, make edits, and publish directly to your repository.

Github OAuth login page

SSR is Required for Production

The module needs server-side routes for authentication, which means you need SSR enabled for production use. Static generation still works if you use hybrid rendering:

export default defineNuxtConfig({
  nitro: {
    prerender: {
      routes: ['/'],
      crawlLinks: true
    }
  }
})

This pre-renders your content pages but keeps the Studio routes as server endpoints. Deploy on any platform that supports nuxt build - Vercel, Netlify, Cloudflare Pages, wherever.

The Current State of Studio

The stable release (v1.0) shipped in January 2026 with everything you need for content editing.

Three Editing Modes

TipTap Visual Editor - This is the default. Notion-like editing experience powered by TipTap and integrated through Nuxt UI Editor. Rich text editing, MDC component support, drag and drop for reordering, slash commands for formatting. It converts between visual content and MDC syntax in real time.

Monaco Code Editor - For people who prefer raw Markdown. Same editor that powers VS Code. Full syntax highlighting, MDC syntax support, direct editing of frontmatter.

Form-Based Editor - Auto-generated forms for YAML/JSON files and frontmatter. Based on your collection definitions in Nuxt Content v3. Define a schema, Studio generates the form. Type mapping happens automatically: strings become text inputs, booleans become toggles, enums become select dropdowns.

Vue Component Props Editing

If you use MDC components in your content, Studio can edit their props visually. Select a component in the editor and a form appears with all its props. No more editing component syntax by hand.

MDC binding example

It also supports MDC binding syntax, so you can bind component props to frontmatter variables. Change the frontmatter, the component updates automatically.

File and Media Management

Studio handles all CRUD operations for your content/ directory. Create, edit, delete, rename, move files. Draft management is built in so your changes are saved to IndexedDB until you're ready to publish.

Media management in Nuxt Studio

Media management covers assets in your public/ directory. Upload files, organize them, preview images. Supports JPEG, PNG, and more.

Git Integration

When you publish, Studio creates a commit with your changes. It detects conflicts (if someone else edited the same file), attributes commits to the right author, and lets you write custom commit messages.

This encourages a clean workflow where you make edits, review changes, publish. Studio handles the Git operations through the GitHub/GitLab API.

Real-Time Preview

Changes can also appear immediately in a side-by-side preview. Studio runs a local SQLite database that mirrors your content, updates it with your drafts, and shows you exactly what the published site will look like. How awesome 🚀

Real Time Preview in Nuxt Studio

This works in production too. Edit content on your live site and see changes before publishing them.

Multi-Language Support

The Studio interface is available in 22 languages: Arabic, Bulgarian, Czech, German, English, Spanish, Persian, Finnish, French, Indonesian, Italian, Japanese, Korean, Norwegian (Bokmål and Nynorsk), Dutch, Polish, Portuguese (Brazil), Russian, Ukrainian, Chinese (Simplified and Traditional).

Migration from the Old Platform

If you were using the hosted nuxt.studio platform, migration is straightforward.

Your content always lived in your Git repository. The platform was just an editing layer. When the platform shuts down, your deployed site is unaffected. Nothing breaks.

To migrate:

1. Install the module: npx nuxi module add nuxt-studio
2. Configure your repository and authentication
3. Remove the preview key from your Nuxt Content config (upcoming Content versions will do this automatically)

That's it. Your content stays the same, your site stays the same. You just switched from their hosted editor to your self-hosted one.

All subscriptions were already canceled. The platform is now the official documentation at nuxt.studio.

What's Coming Next

The roadmap for 2026 includes some interesting additions.

AI Content Assistant - Smart suggestions and content generation. This will be integrated directly into the editor to help with writing and formatting.

Collections View - A unified interface for browsing and managing all your content collections. Currently you navigate the file tree; this will add a database-style view.

TipTap Extension Exposure - The team built custom TipTap extensions for MDC syntax. They're planning to expose these extensions so you can use them with Nuxt UI Editor in your own projects, not just in Studio.

Media Optimization - Automatic optimization of uploaded media files. Compression, format conversion, responsive images.

The team is also open to community-driven features so feel free to share them in GitHub Discussions and Discord.

Should You Use It?

If you're building a Nuxt Content site and need to let non-technical people edit content, yes. Studio makes that possible without building your own admin interface.

If you're a solo developer who's comfortable with your IDE, you might not need it. But even then, the visual editor can be faster for certain edits. The form-based editing is particularly useful for complex frontmatter.

The fact that it's free and open source changes the calculation. There's no pricing tier to worry about, no usage limits. Install it, use what you need, ignore what you don't.

For teams, this is the obvious choice. Developers can work in their IDE while content editors work in Studio. Both workflows write to the same Git repository. No sync issues, no duplication.

Conclusion

Nuxt Studio's transition from hosted platform to open-source module is a big change, but it's the right direction. Self-hosting gives you control, zero cost removes barriers, and the module approach means it's just part of your Nuxt app.

The stable release has all the core features working. The roadmap shows where it's going. And since it's open source, the community can shape what comes next.

If you're working with Nuxt Content, try it out. The local development experience alone makes it worthwhile.

Resources

https://content.nuxt.com/blog/studio-oss

https://www.youtube.com/watch?v=SCyyKT9bw_M