diff --git a/skills/shadcn-vue/README.md b/skills/shadcn-vue/README.md
new file mode 100644
index 0000000..3050f3b
--- /dev/null
+++ b/skills/shadcn-vue/README.md
@@ -0,0 +1,27 @@
+# shadcn-vue Skill for Stitch
+
+This skill provides expert guidance and automation for integrating `shadcn-vue` into your Vue.js projects.
+
+## Features
+
+- **Automated Setup**: Step-by-step instructions for Vite and Nuxt using `yarn`.
+- **Validation Script**: A dedicated bash script to verify your project setup and dependencies.
+- **Component Discovery**: Help finding and installing components from the shadcn-vue registry.
+- **Theming & Customization**: Guidance on using CSS variables and Tailwind CSS to customize your UI.
+- **Best Practices**: Follows official `shadcn-vue` recommendations for project structure and component usage.
+
+## Usage
+
+To use this skill, ensure it is enabled in your Stitch project. You can then ask questions about:
+
+- "How do I install shadcn-vue in a new Vite project?"
+- "How can I add a Button component using yarn?"
+- "How do I customize the primary color in shadcn-vue?"
+- "What is the best way to handle hydration errors in Nuxt with shadcn-vue?"
+
+## Project Structure
+
+- `SKILL.md`: Core skill definitions and instructions.
+- `resources/`: Detailed setup guides for different frameworks.
+- `scripts/`: Verification and automation scripts.
+- `examples/`: Code examples of shadcn-vue components.
diff --git a/skills/shadcn-vue/SKILL.md b/skills/shadcn-vue/SKILL.md
new file mode 100644
index 0000000..9fa6ee5
--- /dev/null
+++ b/skills/shadcn-vue/SKILL.md
@@ -0,0 +1,94 @@
+---
+name: shadcn-vue
+description: Expert guidance for integrating and building applications with shadcn-vue components, including component discovery, installation, customization, and best practices for Vite and Nuxt.
+allowed-tools:
+  - "shadcn*:*"
+  - "mcp_shadcn*"
+  - "Read"
+  - "Write"
+  - "Bash"
+  - "web_fetch"
+---
+
+# shadcn-vue Component Integration
+
+You are a frontend engineer specialized in building applications with shadcn-vue—a collection of beautifully designed, accessible, and customizable components for Vue.js. You help developers discover, integrate, and customize components following best practices.
+
+## Core Principles
+
+shadcn-vue is **not a component library**—it's a collection of reusable components that you copy into your project. This gives you:
+
+- **Full ownership**: Components live in your codebase, not node_modules.
+- **Complete customization**: Modify styling, behavior, and structure freely.
+- **Tailwind CSS Integration**: Built with Tailwind CSS for rapid styling.
+- **Zero runtime overhead**: No library bundle, just the code you need.
+
+## Project Setup
+
+### Initial Configuration
+
+For **new projects**, you can use the Vite or Nuxt templates.
+
+#### Vite Setup (Using Yarn)
+
+1. **Create project**: `yarn create vite@latest my-vue-app --template vue-ts`
+2. **Add Tailwind CSS**: `yarn add tailwindcss @tailwindcss/vite`
+3. **Configure Tailwind CSS**: Use `@import "tailwindcss";` in `src/style.css`.
+4. **Run Initialization**: `yarn dlx shadcn-vue@latest init`
+
+#### Nuxt Setup (Using Yarn)
+
+1. **Create project**: `yarn create nuxt@latest`
+2. **Add Tailwind CSS**: `yarn add tailwindcss @tailwindcss/vite -D`
+3. **Add Nuxt Module**: `yarn dlx nuxi@latest module add shadcn-nuxt`
+4. **Run Initialization**: `yarn dlx shadcn-vue@latest init`
+
+## Component Discovery and Installation
+
+### 1. Component Installation
+
+Use the shadcn-vue CLI to add components:
+
+```bash
+yarn dlx shadcn-vue@latest add [component-name]
+```
+
+This command:
+
+- Downloads the component source code.
+- Installs required dependencies.
+- Places files in `components/ui/` (by default).
+- Updates your configuration.
+
+## Customization Best Practices
+
+### 1. Theme Customization
+
+Edit your Tailwind configuration and CSS variables to match your brand. shadcn-vue uses CSS variables for theming, allowing for easy updates and dark mode support.
+
+### 2. The `cn()` Utility
+
+shadcn-vue components often include a `cn()` helper (usually in `lib/utils.ts`) for class merging:
+
+```typescript
+import { clsx, type ClassValue } from 'clsx'
+import { twMerge } from 'tailwind-merge'
+
+export function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs))
+}
+```
+
+## Resources
+
+Refer to the following resource files for detailed guidance:
+
+- `resources/setup-vite.md` - Step-by-step project initialization for Vite
+- `resources/setup-nuxt.md` - Step-by-step project initialization for Nuxt
+- `scripts/verify-setup.sh` - Validation script for project configuration
+
+## Examples
+
+See the `examples/` directory for:
+
+- `simple-button.vue` - Basic button implementation
diff --git a/skills/shadcn-vue/examples/simple-button.vue b/skills/shadcn-vue/examples/simple-button.vue
new file mode 100644
index 0000000..c085320
--- /dev/null
+++ b/skills/shadcn-vue/examples/simple-button.vue
@@ -0,0 +1,12 @@
+<script setup lang="ts">
+import { Button } from "@/components/ui/button";
+</script>
+
+<template>
+  <div class="flex flex-col items-center justify-center p-8 gap-4">
+    <h1 class="text-2xl font-bold">Hello from shadcn-vue!</h1>
+    <Button>Click Me</Button>
+    <Button variant="outline">Outline Button</Button>
+    <Button variant="ghost">Ghost Button</Button>
+  </div>
+</template>
diff --git a/skills/shadcn-vue/resources/setup-nuxt.md b/skills/shadcn-vue/resources/setup-nuxt.md
new file mode 100644
index 0000000..5db7c89
--- /dev/null
+++ b/skills/shadcn-vue/resources/setup-nuxt.md
@@ -0,0 +1,76 @@
+# Nuxt Setup with shadcn-vue (Yarn)
+
+Follow these steps to set up `shadcn-vue` in a Nuxt project using `yarn`.
+
+## 1. Create Project
+
+```bash
+yarn create nuxt@latest my-nuxt-app
+cd my-nuxt-app
+```
+
+## 2. Add Tailwind CSS
+
+```bash
+yarn add tailwindcss @tailwindcss/vite -D
+```
+
+## 3. Configure Tailwind CSS in Nuxt
+
+#### Create `assets/css/tailwind.css`
+Add the following line:
+
+```css
+@import "tailwindcss";
+```
+
+#### Update `nuxt.config.ts`
+
+```typescript
+import tailwindcss from '@tailwindcss/vite'
+
+export default defineNuxtConfig({
+  css: ['~/assets/css/tailwind.css'],
+  vite: {
+    plugins: [
+      tailwindcss(),
+    ],
+  },
+})
+```
+
+## 4. Add Nuxt Module
+
+```bash
+yarn dlx nuxi@latest module add shadcn-nuxt
+```
+
+## 5. Add SSR Width Plugin (Optional)
+
+To avoid hydration errors on mobile, create `app/plugins/ssr-width.ts`:
+
+```typescript
+import { provideSSRWidth } from '@vueuse/core'
+
+export default defineNuxtPlugin((nuxtApp) => {
+  provideSSRWidth(1024, nuxtApp.vueApp)
+})
+```
+
+## 6. Run Nuxt Prepare
+
+```bash
+yarn dlx nuxi prepare
+```
+
+## 7. Run the CLI Initialization
+
+```bash
+yarn dlx shadcn-vue@latest init
+```
+
+## 8. Add Components
+
+```bash
+yarn dlx shadcn-vue@latest add [component-name]
+```
diff --git a/skills/shadcn-vue/resources/setup-vite.md b/skills/shadcn-vue/resources/setup-vite.md
new file mode 100644
index 0000000..024e998
--- /dev/null
+++ b/skills/shadcn-vue/resources/setup-vite.md
@@ -0,0 +1,73 @@
+# Vite Setup with shadcn-vue (Yarn)
+
+Follow these steps to set up `shadcn-vue` in a Vite project using `yarn`.
+
+## 1. Create Project
+
+```bash
+yarn create vite@latest my-vue-app --template vue-ts
+cd my-vue-app
+```
+
+## 2. Add Tailwind CSS
+
+```bash
+yarn add tailwindcss @tailwindcss/vite
+```
+
+## 3. Configure Tailwind CSS
+
+In `src/style.css`, replace the content with:
+
+```css
+@import "tailwindcss";
+```
+
+## 4. Configure Framework Aliases
+
+#### Edit `tsconfig.json` and `tsconfig.app.json`
+Add the following paths to your compiler options:
+
+```json
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "@/*": ["./src/*"]
+    }
+  }
+}
+```
+
+#### Update `vite.config.ts`
+
+```typescript
+import path from 'node:path'
+import { defineConfig } from 'vite'
+import tailwindcss from '@tailwindcss/vite'
+import vue from '@vitejs/plugin-vue'
+
+export default defineConfig({
+  plugins: [
+    vue(),
+    tailwindcss(),
+  ],
+  resolve: {
+    alias: {
+      '@': path.resolve(__dirname, './src'),
+    },
+  },
+})
+```
+
+## 5. Run the CLI Initialization
+
+```bash
+yarn dlx shadcn-vue@latest init
+```
+
+## 6. Add Components
+
+```bash
+yarn dlx shadcn-vue@latest add [component-name]
+```
diff --git a/skills/shadcn-vue/scripts/verify-setup.sh b/skills/shadcn-vue/scripts/verify-setup.sh
new file mode 100644
index 0000000..e7e92b4
--- /dev/null
+++ b/skills/shadcn-vue/scripts/verify-setup.sh
@@ -0,0 +1,123 @@
+#!/usr/bin/env bash
+# shadcn-vue Setup Verification Script
+# Validates that a project is correctly configured for shadcn-vue
+
+set -e
+
+GREEN='\033[0;32m'
+RED='\033[0;31m'
+YELLOW='\033[1;33m'
+NC='\033[0m' # No Color
+
+echo "🔍 Verifying shadcn-vue setup..."
+echo ""
+
+# Check if components.json exists
+if [ -f "components.json" ]; then
+    echo -e "${GREEN}✓${NC} components.json found"
+else
+    echo -e "${RED}✗${NC} components.json not found"
+    echo -e "  ${YELLOW}Run:${NC} yarn dlx shadcn-vue@latest init"
+    exit 1
+fi
+
+# Check if tailwind.config exists or vite plugin is used
+if [ -f "tailwind.config.js" ] || [ -f "tailwind.config.ts" ] || grep -q "@tailwindcss/vite" package.json 2>/dev/null; then
+    echo -e "${GREEN}✓${NC} Tailwind CSS configuration found"
+else
+    echo -e "${RED}✗${NC} Tailwind CSS configuration not found"
+    echo -e "  ${YELLOW}Install Tailwind:${NC} yarn add tailwindcss @tailwindcss/vite"
+    exit 1
+fi
+
+# Check if tsconfig.json has path aliases
+if [ -f "tsconfig.json" ]; then
+    if grep -q '"@/\*"' tsconfig.json; then
+        echo -e "${GREEN}✓${NC} Path aliases configured in tsconfig.json"
+    else
+        echo -e "${YELLOW}⚠${NC} Path aliases not found in tsconfig.json"
+        echo "  Add to compilerOptions.paths:"
+        echo '  "@/*": ["./src/*"]'
+    fi
+else
+    echo -e "${YELLOW}⚠${NC} tsconfig.json not found (TypeScript not configured)"
+fi
+
+# Check if globals.css or equivalent exists
+CSS_FILE=$(find . -name "style.css" -o -name "globals.css" -o -name "tailwind.css" | head -n 1)
+if [ -n "$CSS_FILE" ]; then
+    echo -e "${GREEN}✓${NC} Global CSS file found ($CSS_FILE)"
+    
+    # Check for Tailwind directives (Legacy or v4)
+    if grep -q "@tailwind" "$CSS_FILE" || grep -q "@import \"tailwindcss\"" "$CSS_FILE"; then
+        echo -e "${GREEN}✓${NC} Tailwind directives present"
+    else
+        echo -e "${RED}✗${NC} Tailwind directives missing"
+        echo "  Add to your CSS file:"
+        echo "  @import \"tailwindcss\";"
+    fi
+else
+    echo -e "${RED}✗${NC} Global CSS file not found"
+fi
+
+# Check if components/ui directory exists
+if [ -d "src/components/ui" ] || [ -d "components/ui" ]; then
+    echo -e "${GREEN}✓${NC} components/ui directory exists"
+    
+    # Count components
+    COMPONENT_COUNT=$(find . -path "*/components/ui/*.vue" | wc -l)
+    echo -e "  ${COMPONENT_COUNT} components installed"
+else
+    echo -e "${YELLOW}⚠${NC} components/ui directory not found"
+    echo "  Add your first component: yarn dlx shadcn-vue@latest add button"
+fi
+
+# Check if lib/utils exists
+UTILS_FILE=$(find . -name "utils.ts" -o -name "utils.js" | grep "lib" | head -n 1)
+if [ -n "$UTILS_FILE" ]; then
+    echo -e "${GREEN}✓${NC} utility file found ($UTILS_FILE)"
+    
+    # Check for cn function
+    if grep -q "export function cn" "$UTILS_FILE"; then
+        echo -e "${GREEN}✓${NC} cn() utility function present"
+    else
+        echo -e "${RED}✗${NC} cn() utility function missing"
+    fi
+else
+    echo -e "${RED}✗${NC} utility file not found (expecting lib/utils.ts or lib/utils.js)"
+fi
+
+# Check package.json dependencies
+if [ -f "package.json" ]; then
+    echo ""
+    echo "📦 Checking dependencies..."
+    
+    # Required dependencies
+    REQUIRED_DEPS=("vue" "tailwindcss" "radix-vue")
+    RECOMMENDED_DEPS=("class-variance-authority" "clsx" "tailwind-merge" "lucide-vue-next")
+    
+    for dep in "${REQUIRED_DEPS[@]}"; do
+        if grep -q "\"$dep\"" package.json; then
+            echo -e "${GREEN}✓${NC} $dep installed"
+        else
+            echo -e "${RED}✗${NC} $dep not installed"
+        fi
+    done
+    
+    echo ""
+    echo "Recommended dependencies:"
+    for dep in "${RECOMMENDED_DEPS[@]}"; do
+        if grep -q "\"$dep\"" package.json; then
+            echo -e "${GREEN}✓${NC} $dep installed"
+        else
+            echo -e "${YELLOW}⚠${NC} $dep not installed (recommended)"
+        fi
+    done
+fi
+
+echo ""
+echo -e "${GREEN}✓${NC} Setup verification complete!"
+echo ""
+echo "Next steps:"
+echo "  1. Add components: yarn dlx shadcn-vue@latest add [component]"
+echo "  2. Browse docs: https://www.shadcn-vue.com"