🎯

shadcn-ui

🎯Skill

from google-labs-code/stitch-skills

VibeIndex|
What it does
|

Provides expert guidance for discovering, installing, and customizing shadcn/ui components with full code ownership and zero runtime overhead.

Overview

Shadcn-UI is a skill from google-labs-code/stitch-skills that provides expert guidance for discovering, installing, and customizing shadcn/ui components. shadcn/ui is a collection of beautifully designed, accessible components built with Radix UI or Base UI and Tailwind CSS that you copy into your project.

Key Features

  • Component discovery with list_components, get_component_metadata, and get_component_demo MCP tools
  • Direct installation via npx shadcn@latest add [component-name] with automatic dependency management
  • Support for custom registries and the Registry Directory
  • Full component customization since code lives in your project, not in node_modules
  • Support for multiple visual styles: Vega, Nova, Maia, Lyra, Mira, and classic themes

Who is this for?

Frontend developers building React applications who want to use shadcn/ui components with AI-assisted discovery, installation, and customization guidance.

📦

Same repository

google-labs-code/stitch-skills(15 items)

shadcn-ui

Installation

Vibe Index InstallInstalls to .claude/skills/
npx vibeindex add google-labs-code/stitch-skills --skill shadcn-ui
skills.sh Install⚠ Installs to .agents/skills/
npx skills add google-labs-code/stitch-skills --skill shadcn-ui
Manual InstallCopy SKILL.md content and save to the path below
~/.claude/skills/shadcn-ui/SKILL.md

SKILL.md

39,706Installs
-
AddedFeb 4, 2026

More from this repository10

🎯
design-md🎯Skill

A skill from Google Labs that analyzes Stitch projects and generates DESIGN.md files documenting design systems in semantic, natural language. Extracts color palettes, typography, geometry, and visual patterns from existing screens.

🎯
react:components🎯Skill

A skill from Google Labs that converts Stitch-generated screens into React component systems with automated validation and design token consistency, compatible with Claude Code, Gemini CLI, and other coding agents.

🎯
enhance-prompt🎯Skill

Optimizes and refines AI prompts by analyzing structure, clarity, context, and potential response quality to improve interaction effectiveness.

🎯
stitch-loop🎯Skill

A skill for Google Labs Stitch that enables autonomous, iterative website building through a baton-passing loop with Stitch MCP page generation and optional Chrome DevTools verification.

🎯
remotion🎯Skill

Generate walkthrough videos from Stitch app designs using Remotion with smooth transitions, zoom effects, and text overlays

🎯
stitch-design🎯Skill

A Google Labs skill that serves as the unified entry point for Stitch design work, handling UI/UX prompt enhancement, design system synthesis, and high-fidelity screen generation via the Stitch MCP server.

🎯
taste-design🎯Skill

Semantic design system skill that generates DESIGN.md files for Google Stitch screen generation, encoding visual atmosphere, a banned-color list (no AI purple/neon), typographic architecture (no generic Inter/Times), asymmetric layout rules, and perpetual micro-motion — so Stitch outputs premium, non-generic UI instead of the default AI-slop look.

🎯
stitch::generate-design🎯Skill

Google Stitch design skill that generates new screens from text or images, edits existing screens, and creates design variants, requiring the Stitch MCP server for integration with coding agents like Claude Code, Gemini CLI, and Cursor.

🎯
stitch::extract-design-md🎯Skill

Extracts a comprehensive DESIGN.md file directly from frontend source code for use with Google Stitch. Part of the Stitch Design Skills collection, compatible with Antigravity, Gemini CLI, Claude Code, and Cursor.

🎯
stitch::manage-design-system🎯Skill

A collection of agent skills for Google Stitch that enables code-to-design conversion, screen generation/editing, design system management (DESIGN.md upload and theme application), static HTML extraction, and asset uploading, compatible with Antigravity, Gemini CLI, Claude Code, and Cursor.