{
  "schemaVersion": "1.0",
  "item": {
    "slug": "tailwind-v4-shadcn",
    "name": "Tailwind v4 Shadcn",
    "source": "tencent",
    "type": "skill",
    "category": "AI 智能",
    "sourceUrl": "https://clawhub.ai/wpank/tailwind-v4-shadcn",
    "canonicalUrl": "https://clawhub.ai/wpank/tailwind-v4-shadcn",
    "targetPlatform": "OpenClaw"
  },
  "install": {
    "downloadMode": "redirect",
    "downloadUrl": "/downloads/tailwind-v4-shadcn",
    "sourceDownloadUrl": "https://wry-manatee-359.convex.site/api/v1/download?slug=tailwind-v4-shadcn",
    "sourcePlatform": "tencent",
    "targetPlatform": "OpenClaw",
    "installMethod": "Manual import",
    "extraction": "Extract archive",
    "prerequisites": [
      "OpenClaw"
    ],
    "packageFormat": "ZIP package",
    "includedAssets": [
      "README.md",
      "SKILL.md",
      "commands/setup.md",
      "templates/theme-provider.tsx",
      "templates/tsconfig.app.json",
      "templates/utils.ts"
    ],
    "primaryDoc": "SKILL.md",
    "quickSetup": [
      "Download the package from Yavira.",
      "Extract the archive and review SKILL.md first.",
      "Import or place the package into your OpenClaw setup."
    ],
    "agentAssist": {
      "summary": "Hand the extracted package to your coding agent with a concrete install brief instead of figuring it out manually.",
      "steps": [
        "Download the package from Yavira.",
        "Extract it into a folder your agent can access.",
        "Paste one of the prompts below and point your agent at the extracted folder."
      ],
      "prompts": [
        {
          "label": "New install",
          "body": "I downloaded a skill package from Yavira. Read SKILL.md from the extracted folder and install it by following the included instructions. Then review README.md for any prerequisites, environment setup, or post-install checks. Tell me what you changed and call out any manual steps you could not complete."
        },
        {
          "label": "Upgrade existing",
          "body": "I downloaded an updated skill package from Yavira. Read SKILL.md from the extracted folder, compare it with my current installation, and upgrade it while preserving any custom configuration unless the package docs explicitly say otherwise. Then review README.md for any prerequisites, environment setup, or post-install checks. Summarize what changed and any follow-up checks I should run."
        }
      ]
    },
    "sourceHealth": {
      "source": "tencent",
      "status": "healthy",
      "reason": "direct_download_ok",
      "recommendedAction": "download",
      "checkedAt": "2026-04-30T16:55:25.780Z",
      "expiresAt": "2026-05-07T16:55:25.780Z",
      "httpStatus": 200,
      "finalUrl": "https://wry-manatee-359.convex.site/api/v1/download?slug=network",
      "contentType": "application/zip",
      "probeMethod": "head",
      "details": {
        "probeUrl": "https://wry-manatee-359.convex.site/api/v1/download?slug=network",
        "contentDisposition": "attachment; filename=\"network-1.0.0.zip\"",
        "redirectLocation": null,
        "bodySnippet": null
      },
      "scope": "source",
      "summary": "Source download looks usable.",
      "detail": "Yavira can redirect you to the upstream package for this source.",
      "primaryActionLabel": "Download for OpenClaw",
      "primaryActionHref": "/downloads/tailwind-v4-shadcn"
    },
    "validation": {
      "installChecklist": [
        "Use the Yavira download entry.",
        "Review SKILL.md after the package is downloaded.",
        "Confirm the extracted package contains the expected setup assets."
      ],
      "postInstallChecks": [
        "Confirm the extracted package includes the expected docs or setup files.",
        "Validate the skill or prompts are available in your target agent workspace.",
        "Capture any manual follow-up steps the agent could not complete."
      ]
    },
    "downloadPageUrl": "https://openagent3.xyz/downloads/tailwind-v4-shadcn",
    "agentPageUrl": "https://openagent3.xyz/skills/tailwind-v4-shadcn/agent",
    "manifestUrl": "https://openagent3.xyz/skills/tailwind-v4-shadcn/agent.json",
    "briefUrl": "https://openagent3.xyz/skills/tailwind-v4-shadcn/agent.md"
  },
  "agentAssist": {
    "summary": "Hand the extracted package to your coding agent with a concrete install brief instead of figuring it out manually.",
    "steps": [
      "Download the package from Yavira.",
      "Extract it into a folder your agent can access.",
      "Paste one of the prompts below and point your agent at the extracted folder."
    ],
    "prompts": [
      {
        "label": "New install",
        "body": "I downloaded a skill package from Yavira. Read SKILL.md from the extracted folder and install it by following the included instructions. Then review README.md for any prerequisites, environment setup, or post-install checks. Tell me what you changed and call out any manual steps you could not complete."
      },
      {
        "label": "Upgrade existing",
        "body": "I downloaded an updated skill package from Yavira. Read SKILL.md from the extracted folder, compare it with my current installation, and upgrade it while preserving any custom configuration unless the package docs explicitly say otherwise. Then review README.md for any prerequisites, environment setup, or post-install checks. Summarize what changed and any follow-up checks I should run."
      }
    ]
  },
  "documentation": {
    "source": "clawhub",
    "primaryDoc": "SKILL.md",
    "sections": [
      {
        "title": "Tailwind v4 + shadcn/ui Stack",
        "body": "Production-tested setup for Tailwind v4 with shadcn/ui. Prevents 8 documented errors through a mandatory four-step architecture."
      },
      {
        "title": "WHAT",
        "body": "Complete Tailwind v4 + shadcn/ui configuration:\n\nFour-step theming architecture (mandatory)\nCSS variable-based color system\nAutomatic dark mode switching\nError prevention for 8 common mistakes\nMigration guide from v3\nProduction-ready templates"
      },
      {
        "title": "WHEN",
        "body": "Starting a new React/Vite project with Tailwind v4\nMigrating from Tailwind v3 to v4\nSetting up shadcn/ui with Tailwind v4\nDebugging: colors not working, dark mode broken, build failures\nFixing @theme inline, @apply, or @layer base issues"
      },
      {
        "title": "KEYWORDS",
        "body": "tailwind v4, tailwindcss 4, shadcn, shadcn/ui, @theme inline, dark mode, css variables, vite, tw-animate-css, tailwind config, migration\n\nProduction verified: WordPress Auditor (https://wordpress-auditor.webfonts.workers.dev)\nVersions: tailwindcss@4.1.18, @tailwindcss/vite@4.1.18"
      },
      {
        "title": "OpenClaw / Moltbot / Clawbot",
        "body": "npx clawhub@latest install tailwind-v4-shadcn"
      },
      {
        "title": "Quick Start",
        "body": "# 1. Install dependencies\npnpm add tailwindcss @tailwindcss/vite\npnpm add -D @types/node tw-animate-css\npnpm dlx shadcn@latest init\n\n# 2. Delete v3 config (v4 doesn't use it)\nrm tailwind.config.ts\n\nvite.config.ts:\n\nimport { defineConfig } from 'vite'\nimport react from '@vitejs/plugin-react'\nimport tailwindcss from '@tailwindcss/vite'\nimport path from 'path'\n\nexport default defineConfig({\n  plugins: [react(), tailwindcss()],\n  resolve: { alias: { '@': path.resolve(__dirname, './src') } }\n})\n\ncomponents.json (CRITICAL):\n\n{\n  \"tailwind\": {\n    \"config\": \"\",\n    \"css\": \"src/index.css\",\n    \"baseColor\": \"slate\",\n    \"cssVariables\": true\n  }\n}"
      },
      {
        "title": "The Four-Step Architecture (MANDATORY)",
        "body": "Skipping steps breaks theming. Follow exactly:"
      },
      {
        "title": "Step 1: Define CSS Variables at Root",
        "body": "/* src/index.css */\n@import \"tailwindcss\";\n@import \"tw-animate-css\";\n\n:root {\n  --background: hsl(0 0% 100%);\n  --foreground: hsl(222.2 84% 4.9%);\n  --primary: hsl(221.2 83.2% 53.3%);\n  --primary-foreground: hsl(210 40% 98%);\n  /* ... all light mode colors with hsl() wrapper */\n}\n\n.dark {\n  --background: hsl(222.2 84% 4.9%);\n  --foreground: hsl(210 40% 98%);\n  --primary: hsl(217.2 91.2% 59.8%);\n  --primary-foreground: hsl(222.2 47.4% 11.2%);\n  /* ... all dark mode colors */\n}\n\nCritical: Define at root level (NOT inside @layer base). Use hsl() wrapper."
      },
      {
        "title": "Step 2: Map Variables to Tailwind",
        "body": "@theme inline {\n  --color-background: var(--background);\n  --color-foreground: var(--foreground);\n  --color-primary: var(--primary);\n  --color-primary-foreground: var(--primary-foreground);\n  /* ... map ALL CSS variables */\n}\n\nWhy: Generates utility classes (bg-background, text-primary). Without this, utilities don't exist."
      },
      {
        "title": "Step 3: Apply Base Styles",
        "body": "@layer base {\n  body {\n    background-color: var(--background);\n    color: var(--foreground);\n  }\n}\n\nCritical: Reference variables directly. Never double-wrap: hsl(var(--background))."
      },
      {
        "title": "Step 4: Result - Automatic Dark Mode",
        "body": "<div className=\"bg-background text-foreground\">\n  {/* Theme switches automatically via .dark class */}\n</div>\n\nNo dark: variants needed for semantic colors."
      },
      {
        "title": "Always Do",
        "body": "Wrap colors with hsl() in :root/.dark: --bg: hsl(0 0% 100%);\nUse @theme inline to map all CSS variables\nSet \"tailwind.config\": \"\" in components.json\nDelete tailwind.config.ts if exists\nUse @tailwindcss/vite plugin (NOT PostCSS)"
      },
      {
        "title": "Never Do",
        "body": "Put :root/.dark inside @layer base\nUse .dark { @theme { } } (v4 doesn't support nested @theme)\nDouble-wrap: hsl(var(--background))\nUse tailwind.config.ts for theme\nUse @apply with @layer base/components classes\nUse dark: variants for semantic colors"
      },
      {
        "title": "Error 1: tw-animate-css Import",
        "body": "Error: Cannot find module 'tailwindcss-animate'\n\n# Wrong (v3 package)\nnpm install tailwindcss-animate\n\n# Correct (v4 package)\npnpm add -D tw-animate-css\n\n@import \"tailwindcss\";\n@import \"tw-animate-css\";"
      },
      {
        "title": "Error 2: Colors Not Working",
        "body": "Error: bg-primary doesn't apply styles\n\nCause: Missing @theme inline mapping\n\n@theme inline {\n  --color-primary: var(--primary);\n  /* Map ALL variables */\n}"
      },
      {
        "title": "Error 3: Dark Mode Not Switching",
        "body": "Cause: Missing ThemeProvider\n\nSee templates/theme-provider.tsx and wrap your app."
      },
      {
        "title": "Error 4: Build Fails",
        "body": "Error: Unexpected config file\n\nrm tailwind.config.ts  # v4 doesn't use this"
      },
      {
        "title": "Error 5: @theme inline Breaks Multi-Theme",
        "body": "Cause: @theme inline bakes values at build time\n\nUse @theme (without inline) for multi-theme systems:\n\n/* For multi-theme (not just light/dark) */\n@theme {\n  --color-text-primary: var(--color-slate-900);\n}\n\n@layer theme {\n  [data-theme=\"dark\"] {\n    --color-text-primary: var(--color-white);\n  }\n}"
      },
      {
        "title": "Error 6: @apply Breaking",
        "body": "Error: Cannot apply unknown utility class\n\nv4 changed @apply behavior:\n\n/* Wrong (v3 pattern) */\n@layer components {\n  .custom-button { @apply px-4 py-2; }\n}\n\n/* Correct (v4 pattern) */\n@utility custom-button {\n  @apply px-4 py-2;\n}"
      },
      {
        "title": "Error 7: @layer base Styles Ignored",
        "body": "Cause: CSS layer cascade issues\n\n/* Better: Don't use @layer base for critical styles */\nbody {\n  background-color: var(--background);\n}"
      },
      {
        "title": "Quick Reference",
        "body": "SymptomCauseFixbg-primary doesn't workMissing @theme inlineAdd mappingColors black/whiteDouble hsl()Use var(--color) not hsl(var(--color))Dark mode stuckMissing ThemeProviderWrap appBuild failstailwind.config.ts existsDelete fileAnimation errorsWrong packageUse tw-animate-css"
      },
      {
        "title": "OKLCH Color Space",
        "body": "v4 uses OKLCH for perceptually uniform colors. Automatic sRGB fallbacks generated.\n\n@theme {\n  /* Modern approach */\n  --color-brand: oklch(0.7 0.15 250);\n  \n  /* Legacy (still works) */\n  --color-brand: hsl(240 80% 60%);\n}"
      },
      {
        "title": "Container Queries (Built-in)",
        "body": "<div className=\"@container\">\n  <div className=\"@md:text-lg @lg:grid-cols-2\">\n    Content responds to container width\n  </div>\n</div>"
      },
      {
        "title": "Line Clamp (Built-in)",
        "body": "<p className=\"line-clamp-3\">Truncate to 3 lines...</p>"
      },
      {
        "title": "Plugins",
        "body": "@import \"tailwindcss\";\n@plugin \"@tailwindcss/typography\";\n@plugin \"@tailwindcss/forms\";"
      },
      {
        "title": "Key Changes",
        "body": "Delete tailwind.config.ts\nMove theme to CSS with @theme inline\nReplace tailwindcss-animate → tw-animate-css\nReplace require() → @plugin\n@apply in @layer components → @utility"
      },
      {
        "title": "Color Migration",
        "body": "// Before: Hardcoded + dark variants\n<div className=\"bg-blue-50 dark:bg-blue-950 text-blue-700 dark:text-blue-300\">\n\n// After: Semantic + automatic\n<div className=\"bg-info/10 text-info\">"
      },
      {
        "title": "Visual Changes",
        "body": "Ring width default: 3px → 1px (use ring-3 to match v3)\nHeading styles removed from Preflight (add via @tailwindcss/typography or custom)"
      },
      {
        "title": "Files",
        "body": "templates/index.css - Complete CSS with all variables\ntemplates/theme-provider.tsx - Dark mode provider\ntemplates/vite.config.ts - Vite configuration\ntemplates/components.json - shadcn/ui v4 config\ntemplates/utils.ts - cn() utility\nreferences/architecture.md - Deep dive on four-step pattern\nreferences/migration-guide.md - Semantic color migration\nreferences/dark-mode.md - Complete dark mode setup"
      },
      {
        "title": "Setup Checklist",
        "body": "@tailwindcss/vite installed\n vite.config.ts uses tailwindcss() plugin\n components.json has \"config\": \"\"\n NO tailwind.config.ts exists\n src/index.css follows 4-step pattern\n ThemeProvider wraps app\n Theme toggle works"
      },
      {
        "title": "NEVER",
        "body": "Put :root or .dark inside @layer base\nUse tailwind.config.ts with v4 (it's ignored)\nDouble-wrap colors: hsl(var(--background))\nUse tailwindcss-animate (use tw-animate-css)\nUse @apply on @layer base/components classes in v4\nSkip the @theme inline step"
      }
    ],
    "body": "Tailwind v4 + shadcn/ui Stack\n\nProduction-tested setup for Tailwind v4 with shadcn/ui. Prevents 8 documented errors through a mandatory four-step architecture.\n\nWHAT\n\nComplete Tailwind v4 + shadcn/ui configuration:\n\nFour-step theming architecture (mandatory)\nCSS variable-based color system\nAutomatic dark mode switching\nError prevention for 8 common mistakes\nMigration guide from v3\nProduction-ready templates\nWHEN\nStarting a new React/Vite project with Tailwind v4\nMigrating from Tailwind v3 to v4\nSetting up shadcn/ui with Tailwind v4\nDebugging: colors not working, dark mode broken, build failures\nFixing @theme inline, @apply, or @layer base issues\nKEYWORDS\n\ntailwind v4, tailwindcss 4, shadcn, shadcn/ui, @theme inline, dark mode, css variables, vite, tw-animate-css, tailwind config, migration\n\nProduction verified: WordPress Auditor (https://wordpress-auditor.webfonts.workers.dev)\nVersions: tailwindcss@4.1.18, @tailwindcss/vite@4.1.18\n\nInstallation\nOpenClaw / Moltbot / Clawbot\nnpx clawhub@latest install tailwind-v4-shadcn\n\nQuick Start\n# 1. Install dependencies\npnpm add tailwindcss @tailwindcss/vite\npnpm add -D @types/node tw-animate-css\npnpm dlx shadcn@latest init\n\n# 2. Delete v3 config (v4 doesn't use it)\nrm tailwind.config.ts\n\n\nvite.config.ts:\n\nimport { defineConfig } from 'vite'\nimport react from '@vitejs/plugin-react'\nimport tailwindcss from '@tailwindcss/vite'\nimport path from 'path'\n\nexport default defineConfig({\n  plugins: [react(), tailwindcss()],\n  resolve: { alias: { '@': path.resolve(__dirname, './src') } }\n})\n\n\ncomponents.json (CRITICAL):\n\n{\n  \"tailwind\": {\n    \"config\": \"\",\n    \"css\": \"src/index.css\",\n    \"baseColor\": \"slate\",\n    \"cssVariables\": true\n  }\n}\n\nThe Four-Step Architecture (MANDATORY)\n\nSkipping steps breaks theming. Follow exactly:\n\nStep 1: Define CSS Variables at Root\n/* src/index.css */\n@import \"tailwindcss\";\n@import \"tw-animate-css\";\n\n:root {\n  --background: hsl(0 0% 100%);\n  --foreground: hsl(222.2 84% 4.9%);\n  --primary: hsl(221.2 83.2% 53.3%);\n  --primary-foreground: hsl(210 40% 98%);\n  /* ... all light mode colors with hsl() wrapper */\n}\n\n.dark {\n  --background: hsl(222.2 84% 4.9%);\n  --foreground: hsl(210 40% 98%);\n  --primary: hsl(217.2 91.2% 59.8%);\n  --primary-foreground: hsl(222.2 47.4% 11.2%);\n  /* ... all dark mode colors */\n}\n\n\nCritical: Define at root level (NOT inside @layer base). Use hsl() wrapper.\n\nStep 2: Map Variables to Tailwind\n@theme inline {\n  --color-background: var(--background);\n  --color-foreground: var(--foreground);\n  --color-primary: var(--primary);\n  --color-primary-foreground: var(--primary-foreground);\n  /* ... map ALL CSS variables */\n}\n\n\nWhy: Generates utility classes (bg-background, text-primary). Without this, utilities don't exist.\n\nStep 3: Apply Base Styles\n@layer base {\n  body {\n    background-color: var(--background);\n    color: var(--foreground);\n  }\n}\n\n\nCritical: Reference variables directly. Never double-wrap: hsl(var(--background)).\n\nStep 4: Result - Automatic Dark Mode\n<div className=\"bg-background text-foreground\">\n  {/* Theme switches automatically via .dark class */}\n</div>\n\n\nNo dark: variants needed for semantic colors.\n\nCritical Rules\nAlways Do\nWrap colors with hsl() in :root/.dark: --bg: hsl(0 0% 100%);\nUse @theme inline to map all CSS variables\nSet \"tailwind.config\": \"\" in components.json\nDelete tailwind.config.ts if exists\nUse @tailwindcss/vite plugin (NOT PostCSS)\nNever Do\nPut :root/.dark inside @layer base\nUse .dark { @theme { } } (v4 doesn't support nested @theme)\nDouble-wrap: hsl(var(--background))\nUse tailwind.config.ts for theme\nUse @apply with @layer base/components classes\nUse dark: variants for semantic colors\nCommon Errors & Solutions\nError 1: tw-animate-css Import\n\nError: Cannot find module 'tailwindcss-animate'\n\n# Wrong (v3 package)\nnpm install tailwindcss-animate\n\n# Correct (v4 package)\npnpm add -D tw-animate-css\n\n@import \"tailwindcss\";\n@import \"tw-animate-css\";\n\nError 2: Colors Not Working\n\nError: bg-primary doesn't apply styles\n\nCause: Missing @theme inline mapping\n\n@theme inline {\n  --color-primary: var(--primary);\n  /* Map ALL variables */\n}\n\nError 3: Dark Mode Not Switching\n\nCause: Missing ThemeProvider\n\nSee templates/theme-provider.tsx and wrap your app.\n\nError 4: Build Fails\n\nError: Unexpected config file\n\nrm tailwind.config.ts  # v4 doesn't use this\n\nError 5: @theme inline Breaks Multi-Theme\n\nCause: @theme inline bakes values at build time\n\nUse @theme (without inline) for multi-theme systems:\n\n/* For multi-theme (not just light/dark) */\n@theme {\n  --color-text-primary: var(--color-slate-900);\n}\n\n@layer theme {\n  [data-theme=\"dark\"] {\n    --color-text-primary: var(--color-white);\n  }\n}\n\nError 6: @apply Breaking\n\nError: Cannot apply unknown utility class\n\nv4 changed @apply behavior:\n\n/* Wrong (v3 pattern) */\n@layer components {\n  .custom-button { @apply px-4 py-2; }\n}\n\n/* Correct (v4 pattern) */\n@utility custom-button {\n  @apply px-4 py-2;\n}\n\nError 7: @layer base Styles Ignored\n\nCause: CSS layer cascade issues\n\n/* Better: Don't use @layer base for critical styles */\nbody {\n  background-color: var(--background);\n}\n\nQuick Reference\nSymptom\tCause\tFix\nbg-primary doesn't work\tMissing @theme inline\tAdd mapping\nColors black/white\tDouble hsl()\tUse var(--color) not hsl(var(--color))\nDark mode stuck\tMissing ThemeProvider\tWrap app\nBuild fails\ttailwind.config.ts exists\tDelete file\nAnimation errors\tWrong package\tUse tw-animate-css\nTailwind v4 New Features\nOKLCH Color Space\n\nv4 uses OKLCH for perceptually uniform colors. Automatic sRGB fallbacks generated.\n\n@theme {\n  /* Modern approach */\n  --color-brand: oklch(0.7 0.15 250);\n  \n  /* Legacy (still works) */\n  --color-brand: hsl(240 80% 60%);\n}\n\nContainer Queries (Built-in)\n<div className=\"@container\">\n  <div className=\"@md:text-lg @lg:grid-cols-2\">\n    Content responds to container width\n  </div>\n</div>\n\nLine Clamp (Built-in)\n<p className=\"line-clamp-3\">Truncate to 3 lines...</p>\n\nPlugins\n@import \"tailwindcss\";\n@plugin \"@tailwindcss/typography\";\n@plugin \"@tailwindcss/forms\";\n\nMigration from v3\nKey Changes\nDelete tailwind.config.ts\nMove theme to CSS with @theme inline\nReplace tailwindcss-animate → tw-animate-css\nReplace require() → @plugin\n@apply in @layer components → @utility\nColor Migration\n// Before: Hardcoded + dark variants\n<div className=\"bg-blue-50 dark:bg-blue-950 text-blue-700 dark:text-blue-300\">\n\n// After: Semantic + automatic\n<div className=\"bg-info/10 text-info\">\n\nVisual Changes\nRing width default: 3px → 1px (use ring-3 to match v3)\nHeading styles removed from Preflight (add via @tailwindcss/typography or custom)\nFiles\ntemplates/index.css - Complete CSS with all variables\ntemplates/theme-provider.tsx - Dark mode provider\ntemplates/vite.config.ts - Vite configuration\ntemplates/components.json - shadcn/ui v4 config\ntemplates/utils.ts - cn() utility\nreferences/architecture.md - Deep dive on four-step pattern\nreferences/migration-guide.md - Semantic color migration\nreferences/dark-mode.md - Complete dark mode setup\nSetup Checklist\n @tailwindcss/vite installed\n vite.config.ts uses tailwindcss() plugin\n components.json has \"config\": \"\"\n NO tailwind.config.ts exists\n src/index.css follows 4-step pattern\n ThemeProvider wraps app\n Theme toggle works\nNEVER\nPut :root or .dark inside @layer base\nUse tailwind.config.ts with v4 (it's ignored)\nDouble-wrap colors: hsl(var(--background))\nUse tailwindcss-animate (use tw-animate-css)\nUse @apply on @layer base/components classes in v4\nSkip the @theme inline step"
  },
  "trust": {
    "sourceLabel": "tencent",
    "provenanceUrl": "https://clawhub.ai/wpank/tailwind-v4-shadcn",
    "publisherUrl": "https://clawhub.ai/wpank/tailwind-v4-shadcn",
    "owner": "wpank",
    "version": "1.0.0",
    "license": null,
    "verificationStatus": "Indexed source record"
  },
  "links": {
    "detailUrl": "https://openagent3.xyz/skills/tailwind-v4-shadcn",
    "downloadUrl": "https://openagent3.xyz/downloads/tailwind-v4-shadcn",
    "agentUrl": "https://openagent3.xyz/skills/tailwind-v4-shadcn/agent",
    "manifestUrl": "https://openagent3.xyz/skills/tailwind-v4-shadcn/agent.json",
    "briefUrl": "https://openagent3.xyz/skills/tailwind-v4-shadcn/agent.md"
  }
}