> ## Documentation Index
> Fetch the complete documentation index at: https://mintlify.com/vercel-labs/skills/llms.txt
> Use this file to discover all available pages before exploring further.

# Skills CLI

> The open agent skills ecosystem

<div className="relative py-20 bg-gradient-to-br from-[#1a1a1a] via-[#0f0f0f] to-[#090909] dark:from-[#1a1a1a] dark:via-[#0f0f0f] dark:to-[#090909] overflow-hidden">
  <div className="absolute inset-0 bg-[url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNjAiIGhlaWdodD0iNjAiIHZpZXdCb3g9IjAgMCA2MCA2MCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0zNiAxOGMtNi42MjcgMC0xMiA1LjM3My0xMiAxMnM1LjM3MyAxMiAxMiAxMiAxMi01LjM3MyAxMi0xMi01LjM3My0xMi0xMi0xMnptMCAyMmMtNS41MjMgMC0xMC00LjQ3Ny0xMC0xMHM0LjQ3Ny0xMCAxMC0xMCAxMCA0LjQ3NyAxMCAxMC00LjQ3NyAxMC0xMCAxMHoiIGZpbGw9IiMyNzI3MmEiIG9wYWNpdHk9IjAuMiIvPjwvZz48L3N2Zz4=')] opacity-10" />

  <div className="max-w-6xl mx-auto px-6 lg:px-8 relative z-10">
    <div className="grid lg:grid-cols-12 gap-12 items-center">
      <div className="lg:col-span-7">
        <h1 className="text-5xl sm:text-6xl lg:text-7xl font-bold text-white dark:text-white mb-6">
          Skills CLI
        </h1>

        <p className="text-xl sm:text-2xl text-gray-300 dark:text-gray-300 mb-8 max-w-2xl">
          The CLI for the open agent skills ecosystem. Install, manage, and share skills across 40+ AI coding agents.
        </p>

        <div className="flex flex-wrap gap-4">
          <a href="/quickstart" className="inline-flex items-center px-6 py-3 rounded-lg bg-[#7c7c7c] text-white dark:bg-[#7c7c7c] dark:text-white font-semibold hover:bg-[#6a6a6a] dark:hover:bg-[#6a6a6a] transition-colors no-underline">
            Get Started

            <svg className="ml-2 w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M13 7l5 5m0 0l-5 5m5-5H6" />
            </svg>
          </a>

          <a href="/commands/add" className="inline-flex items-center px-6 py-3 rounded-lg border border-gray-600 dark:border-gray-600 bg-white/5 dark:bg-white/5 text-white dark:text-white font-semibold hover:bg-white/10 dark:hover:bg-white/10 hover:border-[#7c7c7c] dark:hover:border-[#7c7c7c] transition-colors no-underline">
            View Commands
          </a>
        </div>

        <div className="mt-8 flex items-center gap-4">
          <code className="px-4 py-2 bg-[#121212] dark:bg-[#121212] rounded-lg text-gray-300 dark:text-gray-300 border border-[#2c2c2c] dark:border-[#2c2c2c] font-mono text-sm">
            npx skills add vercel-labs/agent-skills
          </code>
        </div>
      </div>

      <div className="lg:col-span-5 hidden lg:block">
        <div className="relative">
          <div className="absolute inset-0 bg-gradient-to-r from-[#7c7c7c] to-transparent opacity-20 blur-3xl" />

          <div className="relative bg-[#121212] dark:bg-[#121212] border border-[#2c2c2c] dark:border-[#2c2c2c] rounded-2xl p-6 shadow-[0_2px_6px_rgba(0,0,0,0.8)]">
            <div className="flex items-center gap-2 mb-4">
              <div className="w-3 h-3 rounded-full bg-red-500" />

              <div className="w-3 h-3 rounded-full bg-yellow-500" />

              <div className="w-3 h-3 rounded-full bg-green-500" />
            </div>

            <pre className="text-sm text-gray-300 dark:text-gray-300 font-mono">
              <code>
                {`$ npx skills add vercel-labs/agent-skills

                                ✓ Found 12 skills
                                ✓ Installing to OpenCode, Cursor, Claude Code
                                ✓ Skills installed successfully

                                Skills available:
                                • web-design-guidelines
                                • frontend-design
                                • skill-creator
                                • release-notes
                                • ...and 8 more`}
              </code>
            </pre>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

<div className="mt-16 mb-16 max-w-5xl mx-auto px-6">
  <div className="text-center mb-12">
    <h2 className="text-3xl font-bold text-gray-900 dark:text-white mb-4">Quick start</h2>
    <p className="text-lg text-gray-600 dark:text-gray-400">Get up and running in three simple steps</p>
  </div>

  <Steps>
    <Step title="Install a skill">
      Install skills from GitHub, GitLab, or local paths using the `add` command:

      ```bash theme={null}
      npx skills add vercel-labs/agent-skills
      ```

      The CLI automatically detects which AI coding agents you have installed and offers to install skills to them.
    </Step>

    <Step title="Choose your agents">
      Select which agents should receive the skills. Skills work with OpenCode, Cursor, Claude Code, Cline, and 40+ other agents:

      ```bash theme={null}
      npx skills add vercel-labs/agent-skills -a opencode -a cursor
      ```

      <Tip>Use `-g` flag to install globally across all projects, or omit it to install locally in your current project.</Tip>
    </Step>

    <Step title="Start using skills">
      Once installed, your AI coding agent automatically loads the skills. They'll enhance your agent with specialized knowledge and capabilities:

      ```bash theme={null}
      # List all installed skills
      npx skills list

      # Check for updates
      npx skills check
      ```

      <Info>Skills are markdown files with instructions that extend your agent's capabilities in specific domains like testing, documentation, or design.</Info>
    </Step>
  </Steps>
</div>

<div className="mt-16 mb-16 max-w-5xl mx-auto px-6">
  <div className="text-center mb-12">
    <h2 className="text-3xl font-bold text-gray-900 dark:text-white mb-4">Explore commands</h2>
    <p className="text-lg text-gray-600 dark:text-gray-400">Everything you need to manage agent skills</p>
  </div>

  <CardGroup cols={3}>
    <Card title="Add skills" icon="plus" href="/commands/add">
      Install skills from GitHub, GitLab, or local paths
    </Card>

    <Card title="Find skills" icon="magnifying-glass" href="/commands/find">
      Search for skills interactively or by keyword
    </Card>

    <Card title="List skills" icon="list" href="/commands/list">
      View all installed skills across your agents
    </Card>

    <Card title="Remove skills" icon="trash" href="/commands/remove">
      Remove installed skills from your agents
    </Card>

    <Card title="Check updates" icon="arrows-rotate" href="/commands/check">
      Check if your installed skills have updates
    </Card>

    <Card title="Update skills" icon="arrow-up" href="/commands/update">
      Update all skills to their latest versions
    </Card>
  </CardGroup>
</div>

<div className="mt-16 mb-16 max-w-5xl mx-auto px-6">
  <div className="text-center mb-12">
    <h2 className="text-3xl font-bold text-gray-900 dark:text-white mb-4">Key features</h2>
    <p className="text-lg text-gray-600 dark:text-gray-400">Powerful capabilities for managing agent skills</p>
  </div>

  <div className="grid md:grid-cols-2 gap-6">
    <div className="bg-gray-50 dark:bg-[#1a1d27] border border-gray-200 dark:border-[#27272a] rounded-2xl p-6 hover:border-[#7c7c7c] dark:hover:border-[#7c7c7c] transition-colors">
      <div className="flex items-center gap-3 mb-3">
        <div className="w-10 h-10 rounded-lg bg-[#7c7c7c] dark:bg-[#7c7c7c] flex items-center justify-center">
          <svg className="w-5 h-5 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
            <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M13 10V3L4 14h7v7l9-11h-7z" />
          </svg>
        </div>

        <h3 className="text-xl font-semibold text-gray-900 dark:text-white">40+ Agents Supported</h3>
      </div>

      <p className="text-gray-600 dark:text-gray-400">
        Works with OpenCode, Cursor, Claude Code, Cline, GitHub Copilot, and dozens more AI coding agents.
      </p>
    </div>

    <div className="bg-gray-50 dark:bg-[#1a1d27] border border-gray-200 dark:border-[#27272a] rounded-2xl p-6 hover:border-[#7c7c7c] dark:hover:border-[#7c7c7c] transition-colors">
      <div className="flex items-center gap-3 mb-3">
        <div className="w-10 h-10 rounded-lg bg-[#7c7c7c] dark:bg-[#7c7c7c] flex items-center justify-center">
          <svg className="w-5 h-5 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
            <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M10 20l4-16m4 4l4 4-4 4M6 16l-4-4 4-4" />
          </svg>
        </div>

        <h3 className="text-xl font-semibold text-gray-900 dark:text-white">Multiple Sources</h3>
      </div>

      <p className="text-gray-600 dark:text-gray-400">
        Install from GitHub, GitLab, git URLs, or local paths. Full flexibility for your workflow.
      </p>
    </div>

    <div className="bg-gray-50 dark:bg-[#1a1d27] border border-gray-200 dark:border-[#27272a] rounded-2xl p-6 hover:border-[#7c7c7c] dark:hover:border-[#7c7c7c] transition-colors">
      <div className="flex items-center gap-3 mb-3">
        <div className="w-10 h-10 rounded-lg bg-[#7c7c7c] dark:bg-[#7c7c7c] flex items-center justify-center">
          <svg className="w-5 h-5 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
            <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M7 21a4 4 0 01-4-4V5a2 2 0 012-2h4a2 2 0 012 2v12a4 4 0 01-4 4zm0 0h12a2 2 0 002-2v-4a2 2 0 00-2-2h-2.343M11 7.343l1.657-1.657a2 2 0 012.828 0l2.829 2.829a2 2 0 010 2.828l-8.486 8.485M7 17h.01" />
          </svg>
        </div>

        <h3 className="text-xl font-semibold text-gray-900 dark:text-white">Smart Installation</h3>
      </div>

      <p className="text-gray-600 dark:text-gray-400">
        Choose between symlink (recommended) or copy methods. Symlinks keep skills in sync across agents.
      </p>
    </div>

    <div className="bg-gray-50 dark:bg-[#1a1d27] border border-gray-200 dark:border-[#27272a] rounded-2xl p-6 hover:border-[#7c7c7c] dark:hover:border-[#7c7c7c] transition-colors">
      <div className="flex items-center gap-3 mb-3">
        <div className="w-10 h-10 rounded-lg bg-[#7c7c7c] dark:bg-[#7c7c7c] flex items-center justify-center">
          <svg className="w-5 h-5 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
            <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15" />
          </svg>
        </div>

        <h3 className="text-xl font-semibold text-gray-900 dark:text-white">Update Management</h3>
      </div>

      <p className="text-gray-600 dark:text-gray-400">
        Check for updates and upgrade all skills with a single command. Keep your tools current.
      </p>
    </div>
  </div>
</div>

<div className="mt-16 mb-16 max-w-5xl mx-auto px-6">
  <div className="text-center mb-12">
    <h2 className="text-3xl font-bold text-gray-900 dark:text-white mb-4">Resources</h2>
    <p className="text-lg text-gray-600 dark:text-gray-400">Learn more about agent skills</p>
  </div>

  <CardGroup cols={2}>
    <Card title="What are skills?" icon="lightbulb" href="/guides/what-are-skills">
      Learn about agent skills and how they extend your AI coding agent's capabilities
    </Card>

    <Card title="Creating skills" icon="file-code" href="/guides/creating-skills">
      Write your own skills to share specialized knowledge with your team
    </Card>

    <Card title="Supported agents" icon="robot" href="/guides/supported-agents">
      See the complete list of supported AI coding agents
    </Card>

    <Card title="Troubleshooting" icon="wrench" href="/resources/troubleshooting">
      Solutions to common issues and error messages
    </Card>
  </CardGroup>
</div>

<div className="mt-20 mb-16 max-w-5xl mx-auto px-6">
  <div className="bg-gradient-to-br from-[#1a1a1a] to-[#090909] dark:from-[#1a1a1a] dark:to-[#090909] rounded-2xl p-12 text-center border border-[#2c2c2c] dark:border-[#2c2c2c]">
    <h2 className="text-3xl font-bold text-white dark:text-white mb-4">Ready to get started?</h2>

    <p className="text-xl text-gray-300 dark:text-gray-300 mb-8 max-w-2xl mx-auto">
      Install your first skill in seconds and extend your AI coding agent with specialized capabilities.
    </p>

    <a href="/quickstart" className="inline-flex items-center px-8 py-4 rounded-lg bg-[#7c7c7c] text-white dark:bg-[#7c7c7c] dark:text-white font-semibold hover:bg-[#6a6a6a] dark:hover:bg-[#6a6a6a] transition-colors text-lg no-underline">
      Get Started

      <svg className="ml-2 w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
        <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M13 7l5 5m0 0l-5 5m5-5H6" />
      </svg>
    </a>
  </div>
</div>