SkillSet for VS Code

Import production-ready development skills for Claude Code, Cursor, GitHub Copilot, and other AI coding assistants directly from VS Code.

SkillSet for VS Code brings the power of the SkillSet CLI directly into your editor with an intuitive visual interface, tree views, and quick setup wizards.

Features

• 📚 155+ Production-Ready Skills - From project setup to deployment, security to AI engineering
• 🎯 Visual Skill Manager - Beautiful webview interface for browsing and installing skills
• ⚡ Quick Setup Presets - Get started in seconds with pre-configured skill bundles
• 🌳 Tree View Sidebar - Browse installed and available skills at a glance
• 🔍 Skill Search - Find skills quickly with tree view filter, command palette quick search with fuzzy matching, and real-time filtering in the webview manager
• ⭐ Skill Favorites - Mark your most-used skills with star buttons, view them in a dedicated sidebar section, and quickly add them from the webview manager (persists across sessions)
• 🔗 Skill Dependencies - View prerequisites, related skills, and suggested next skills for 40+ skills with dependency data
• 🔄 Auto-Refresh - Automatically detects changes to skill files
• 🛠️ Multi-Tool Support - Works with Claude Code, Cursor, GitHub Copilot, and more
• 📊 10 Specialized Domains - Foundation, Frontend, Backend, AI Engineering, Architecture, CI/CD, Database, Testing, Security, Performance

Installation

1. Open VS Code
2. Press Ctrl+P / Cmd+P to open Quick Open
3. Type ext install patricio0312rev.skillset-vscode
4. Press Enter

Or search for "SkillSet" in the Extensions view (Ctrl+Shift+X / Cmd+Shift+X).

Getting Started

First-Time Setup

When you first install the extension, you'll see a welcome message with two options:

• Quick Setup - Choose from pre-configured skill bundles (Full Stack, AI Engineer, DevOps, etc.)
• Custom Setup - Step-by-step wizard to select exactly what you need

Using the Extension

1. Visual Skill Manager

Click the SkillSet icon in the status bar or run the SkillSet: Open SkillSet Manager command to open the visual interface.

The manager guides you through:

1. Selecting your AI tool (Claude Code, Cursor, Copilot, or Other)
2. Choosing skill domains (Foundation, Frontend, Backend, etc.)
3. Selecting specific skills (or installing all)
4. Customizing the installation folder (optional)

2. Quick Setup

Use SkillSet: Quick Setup for instant installation with presets:

• 🚀 Full Stack Developer - Complete setup for building full-stack applications
• 🤖 AI Engineer - Specialized for AI and ML engineering
• 🎨 Frontend Specialist - UI/UX focused with modern frameworks
• ⚙️ Backend Specialist - API and server-side development
• 🔄 DevOps Engineer - Infrastructure, CI/CD, and automation
• 🏢 Enterprise Complete - All domains for comprehensive development

3. Sidebar Tree Views

The extension adds two tree views to your sidebar:

• Installed Skills - View and manage skills in your workspace
• Available Skills - Browse all 155+ skills from the library

Click any skill to open and view its contents.

4. Search Skills

Find skills quickly using multiple methods:

• Tree View Filter - Click the search icon in the tree view title bar to filter by name, ID, or description
• Quick Search - Use SkillSet: Quick Search command for fuzzy matching with instant skill preview
• Webview Search - Real-time filtering in the visual skill manager

5. Skill Favorites

Mark frequently used skills for quick access:

• Star Button - Click the star icon on any skill in the webview manager
• Right-Click Menu - Toggle favorite status from the context menu in tree view
• Favorites Section - View all favorites in a dedicated sidebar section
• Webview Quick-Add - Add favorites directly from the visual manager

Favorites persist across VS Code sessions.

6. Skill Dependencies

Understand skill relationships before installing:

• Prerequisites - Skills that should be installed first
• Related Skills - Complementary skills that work well together
• Suggested Next - Recommended skills to explore after installation

Dependency information is displayed in the skill preview and covers 40+ skills.

Commands

Access all commands via the Command Palette (Ctrl+Shift+P / Cmd+Shift+P):

• SkillSet: Open SkillSet Manager - Open the visual skill manager
• SkillSet: Quick Setup - Quick installation with presets
• SkillSet: Initialize Skills - Step-by-step skill installation
• SkillSet: Quick Search - Open quick pick to search all skills with fuzzy matching and instant preview
• SkillSet: Search Skills - Filter skills in tree view by name, ID, or description
• SkillSet: Toggle Favorite - Add or remove skill from favorites (also available via right-click context menu)
• SkillSet: Refresh Skills - Refresh skill tree views
• SkillSet: Update Skills - Update existing skills to latest versions
• SkillSet: Remove All Skills - Remove all installed skills
• SkillSet: Open Settings - Open SkillSet settings

Configuration

Customize SkillSet in VS Code settings:

{
  // Default AI tool for skill generation
  "skillset.defaultTool": "claude-code", // or "cursor", "copilot", "other"

  // Custom folder override (leave empty for tool defaults)
  "skillset.defaultFolder": "",

  // Enable/disable automatic skill tree refresh
  "skillset.autoRefresh": true,

  // Show/hide welcome message for first-time users
  "skillset.showWelcome": true,

  // Pre-selected domains for quick initialization
  "skillset.defaultDomains": ["foundation", "backend", "frontend"],

  // Your favorite skills for quick access
  "skillset.favoriteSkills": ["project-scaffolder", "git-hygiene-enforcer"]
}

Available Domains

Tool-Specific Folders

The extension automatically uses the correct folder structure for your AI tool:

• Claude Code: .claude/skills/ - YAML frontmatter format
• Cursor: .cursor/rules/ - Markdown rules format
• GitHub Copilot: .github/skills/ - YAML frontmatter format
• Other Tools: .claude/skills/ - Universal format

Requirements

• VS Code 1.85.0 or higher
• An open workspace folder

Extension Architecture

The extension is built with:

• TypeScript - Fully typed for reliability
• Modular Design - Separate services, providers, and commands
• VS Code APIs - Native tree views, webviews, and file system
• SkillSet Library - Powered by @patricio0312rev/skillset

Related Projects

• SkillSet CLI - Command-line tool for skill management
• Skills Collection - The complete library of 155+ skills
• AgentKit - Scaffold AI agent configurations

Contributing

Contributions are welcome! Please check out the contribution guidelines.

Support

• 🐛 Report an issue
• 💬 Discussions
• 📧 Email

📄 License

This project is licensed under the MIT License. See the LICENSE file for details.

Stay safe when working with AI! 🛡️

Enjoy! 💜

Made with love by Patricio Marroquin