react-bits

React Bits MCP Server exposes a large library of premium React components (over 99) organized into Animations, Backgrounds, Components, and Text Animations. The server implements the MCP protocol, allowing clients to list available components, fetch component source code, retrieve demos and metadata, and perform searches. Tools exposed include list_components, get_component, get_component_demo, get_component_metadata, and search_components. You can run the server as a global CLI and then connect a MCP client to query and fetch components. In practice, you typically configure your MCP client with the server under the mcpServers section, then call the provided tools to explore or render components from the library. The server reads components directly from the filesystem, requires no external API keys, and includes TypeScript definitions for integration in TypeScript-based projects.

Prerequisites:\n- Node.js 18+ installed on your system (nvm is optional but recommended)\n- npm (or yarn)\n\nOption A: Install as a global CLI (recommended for quick usage)\n1. Install the MCP server globally:\nbash\nnpm install -g react-bits-mcp-server\n\n2. Run the server (may vary slightly depending on your shell):\nbash\nreact-bits-mcp\n\n3. Connect your MCP client to the server using the provided mcp configuration.\n\nOption B: Install from GitHub (local development)\n1. Clone the repository:\nbash\ngit clone https://github.com/duolabstech/react-bits-mcp-server.git\ncd react-bits-mcp-server\n\n2. Install dependencies:\nbash\nnpm install\n\n3. Start the server (adjust start script if needed in package.json):\nbash\nnpm install && npm run build && npm start\n

Tips and notes:\n- The server is file-based; it reads components directly from the repository filesystem, so no external API keys are required.\n- If you use the MCP client, you can list, fetch, demo, and metadata for components using the available tools.\n- For environments with private components, you can pass a GitHub token via the env option in the MCP configuration (if needed to access private content).\n- This server provides TypeScript definitions to ease integration in TS projects.\n- If you encounter permission or PATH issues when using the global CLI, ensure npm global bin is in your system PATH or use npx as shown in the mcp_config.\n- You can also run the server locally via a project-specific setup and reference it by its local path if you prefer not to install globally.\n- When updating, re-run npm install to fetch any new dependencies or changes from the repository.