Nuxt Ui

This is your go-to when you're building UIs in Nuxt 4 or Vue 3 with the official Nuxt UI component library. It covers all 125+ components, from basic buttons and cards to complex data tables and overlays, plus the Tailwind Variants theming system and form validation with Zod or Valibot. The skill is well organized with separate references for installation, theming, forms, overlays, and composables, so you can load just what you need instead of dumping everything into context. One thing to note: it's built on top of Reka UI headless primitives, so for deep accessibility patterns or the asChild API you'll want to pull in that skill too. Good token efficiency at around 300 for the main file.

skills.sh installs: 7.2K
GitHub stars: 723
last updated: Aug 21, 2026

View on GitHub

Install

$ npx -y skills add onmax/nuxt-skills --skill nuxt-ui --agent claude-code

Installs into .claude/skills of the current project.

Files

Nuxt UI

Vue component library built on Reka UI + Tailwind CSS + Tailwind Variants. Works with Nuxt, Vue (Vite), Laravel (Vite + Inertia), and AdonisJS (Vite + Inertia).

MCP Server

For component API details (props, slots, events, full documentation, examples), use the Nuxt UI MCP server. If not already configured, add it:

Cursor — .cursor/mcp.json:

{ "mcpServers": { "nuxt-ui": { "type": "http", "url": "https://ui.nuxt.com/mcp" } } }

Claude Code:

claude mcp add --transport http nuxt-ui https://ui.nuxt.com/mcp

Key MCP tools:

search-components — find components by name, category, or intent (no params = list all)
search-composables — find composables by name or description (no params = list all)
search-icons — search Iconify icons (defaults to lucide), returns i-{prefix}-{name} names
get-component — full component documentation with usage examples
get-component-metadata — props, slots, events (lightweight, no docs content)
get-example — real-world code examples

SKILL.md on GitHub

Details

Repository: github.com/onmax/nuxt-skills
Categories: Frontend Development, DevOps & CI/CD
First seen: May 16, 2026