MCP

Use Vritti UI components with AI assistants via the Model Context Protocol.

The Model Context Protocol (MCP) enables AI assistants to browse, search, and install Vritti UI components using natural language.

With MCP configured, you can ask your AI assistant things like:

• "Add the animated beam component from vritti"
• "Install a pricing block from vritti"
• "Show me all animation components in vritti"

Setup

1. Add the Vritti Registry

Add Vritti as a registry in your project's components.json:

Copy{
  "$schema": "https://ui.shadcn.com/schema.json",
  "registries": {
    "vritti": {
      "url": "https://vritti.thesatyajit.com/r"
    }
  }
}

2. Configure the MCP Server

The shadcn MCP server works with any shadcn-compatible registry, including Vritti.

Copyclaude mcp add shadcn -- npx -y @anthropic-ai/shadcn-mcp-server@latest

How It Works

1. Registry Connection - The MCP server connects to Vritti's registry at https://vritti.thesatyajit.com/r
2. Component Discovery - The AI assistant can search and browse all 427+ components and 241+ blocks
3. Installation - When you ask for a component, the assistant installs it using the shadcn CLI

Direct CLI Installation

You can also install components directly without MCP:

pnpmnpmyarnbun
pnpm dlx shadcn@latest add "https://vritti.thesatyajit.com/r/animated-beam"
Copy

Registry Endpoints

Available MCP Tools

When the MCP server is configured, your AI assistant has access to:

• search - Search for components by name, description, or category
• view - View component details, dependencies, and source code
• install - Install components into your project
• browse - Browse components by category