Tailgrids AI & MCP Setup

The Tailgrids MCP (Model Context Protocol) server allows AI agents like Cursor, Windsurf, and VS Code Copilot to access and use Tailgrids UI components directly into your codebase and generate, modify or replace components based on your needs and preferences.

Quick Installation

The easiest way to get started is by installing our extension in your preferred code editor. Click on your editor below to open the installation page directly.

VS Code

Cursor

Antigravity

Windsurf

Manual Installation

If you prefer to configure the MCP server manually, you can add it to your editor's configuration.

VS Code

For VS Code or other similar MCP agents, add the following to your MCP settings:

{
  "mcpServers": {
    "tailgrids": {
      "command": "npx",
      "args": ["-y", "@tailgrids/mcp@latest"]
    }
  }
}

Cursor

1. Go to Settings > Tools & MCP.
2. Click Add Custom MCP.
3. Paste the following code:

{
  "mcpServers": {
    "tailgrids": {
      "command": "npx",
      "args": ["-y", "@tailgrids/mcp@latest"]
    }
  }
}

Windsurf

Add the following to your ~/.codeium/windsurf/mcp_config.json:

{
  "mcpServers": {
    "tailgrids": {
      "command": "npx",
      "args": ["-y", "@tailgrids/mcp@latest"]
    }
  }
}