Add to your Claude Desktop configuration:

macOS: ~/Library/Application Support/Claude/claude_desktop_config.json Windows: %APPDATA%\Claude\claude_desktop_config.json Linux: ~/.config/Claude/claude_desktop_config.json

{
  "mcpServers": {
    "reactbits": {
      "command": "npx",
      "args": ["reactbits-dev-mcp-server"],
      "env": {
        "GITHUB_TOKEN": "your_github_token_here"
      }
    }
  }
}

VS Code (with Continue extension)

Add to your VS Code settings:

{
  "continue.server": {
    "mcpServers": {
      "reactbits": {
        "command": "npx",
        "args": ["reactbits-dev-mcp-server"]
      }
    }
  }
}

Cursor

Add to your Cursor settings or .cursorrules:

{
  "mcpServers": {
    "reactbits": {
      "command": "npx",
      "args": ["reactbits-dev-mcp-server"],
      "env": {
        "GITHUB_TOKEN": "your_github_token_here"
      }
    }
  }
}

Quick Start

# Clone and install
git clone https://github.com/yourusername/reactbits-mcp-server
cd reactbits-mcp-server
npm install

# Build
npm run build

# Test locally
node test-list-components.js

Available Tools

`list_components`

List all available ReactBits components with optional filtering.

Parameters:

category (optional): Filter by category (e.g., "animations", "backgrounds", "buttons")
style (optional): Filter by styling method ("css", "tailwind", "default")
limit (optional): Maximum number of components to return

Example:

"List all animation components with Tailwind support"

`get_component`

Get the source code for a specific ReactBits component.

Parameters:

name (required): Name of the component (e.g., "splash-cursor", "pixel-card")
style (optional): Preferred styling method ("css", "tailwind", "default")

Example:

"Show me the source code for the splash cursor component"

`search_components`

Search for ReactBits components by name or description.

Parameters:

query (required): Search query
category (optional): Filter by category
limit (optional): Maximum number of results

Example:

"Find all components related to cards"

`get_component_demo`

Get usage example and demo code for a ReactBits component.

Parameters:

name (required): Name of the component

Example:

"Show me how to use the glow button component"

`list_categories`

List all available component categories.

Example:

"What categories of components are available?"

Usage Examples

With AI Assistants

Once configured, you can ask your AI assistant questions like:

"Show me all the background animation components from ReactBits"
"I need a glowing button component - what's available?"
&quo

Categories

Current Category: components

reactbits-mcp-server

livewire-flux-mcp

mcp-react-component-harvester