Nuxt 3 Starter

Welcome to the Input Studio Nuxt 3 Starter — an opinionated template for building modern, high-performance web applications with Nuxt 3.
This starter is tailored to our workflow at Input Studio and is not a generic boilerplate. For full flexibility, customize it to fit your needs!

📚 For more on Nuxt 3, see the official documentation.

Features

• 🪁 Tailwind CSS v4 — Utility-first CSS framework for rapid UI development.
• 🇬 Nuxt Fonts — Effortlessly manage and optimize web fonts.
• 🚀 Nuxt Icon — Use any icon from the icones.js.org collection.
• 🔍 Nuxt SEO — Automated SEO essentials: robots.txt, sitemap, link checker, and more.
• 🧰 VueUse — Essential Vue composition utilities for every project.
• 💾 HTTP cache & compression — Optimized static asset delivery.
• 🪛 ESLint & Prettier — Consistent code style with Tailwind plugin.
• 🤖 MCP Server — Enhance code understanding for AI tools like GitHub Copilot in VS Code agent mode.
• ⚙️ VS Code Ready — Editor settings and recommended extensions included.
• 🐋 Production-Ready Dockerfile — Multi-stage build for minimal, secure images.

Getting Started

Requirements:

• Node.js v22+ (or use Volta for automatic version management)
• pnpm (recommended, but npm/yarn also work)

Create a new project:

npx nuxi init -t gh:inputstudio/nuxt3-starter <project-name>
cd <project-name>
pnpm install
pnpm dev

Customize:
Search for TODO in your editor (or use the Todo Tree VS Code extension) to find areas to personalize.

UI Frameworks

Tailwind CSS is included by default.
You can add any UI library you like. Recommended options (all Tailwind-compatible):

• Headless UI
• Daisy UI
• NuxtUI
• Flowbite

Production Build

To build for production:

pnpm build

For deployment guides, see the Nuxt deployment docs.

🐳 Docker

Build your image:

docker build -t myapp .

Push to your registry:

docker push myregistry.com/myapp

For more, see Docker's Node.js guide and getting started docs.

References

• Nuxt 3 Documentation
• Tailwind CSS
• VueUse