# Heroui Mcp

> ⚙️ MCP servers for HeroUI React v3 and HeroUI Native.

- **Type:** MCP server
- **Install:** `agentstack add mcp-heroui-inc-heroui-mcp`
- **Verified:** Yes — security-reviewed for prompt injection and unsafe behavior
- **Seller:** [heroui-inc](https://agentstack.voostack.com/s/heroui-inc)
- **Installs:** 0
- **Category:** [Integrations](https://agentstack.voostack.com/c/integrations)
- **Latest version:** 0.1.0
- **License:** MIT
- **Upstream author:** [heroui-inc](https://github.com/heroui-inc)
- **Source:** https://github.com/heroui-inc/heroui-mcp

## Install

```sh
agentstack add mcp-heroui-inc-heroui-mcp
```

Requires the [AgentStack CLI](https://agentstack.voostack.com/docs/cli). Works with Claude Code, Cursor, and any MCP-compatible agent.

## About

# HeroUI MCP Monorepo

Model Context Protocol (MCP) servers for the HeroUI design system. Access HeroUI component documentation directly in your AI assistant.

## MCPs

| MCP | Description | Docs |
| --- | --- | --- |
| `@heroui/react-mcp` | MCP server for web (`@heroui/react`) component docs, examples, and theme data | [README](apps/react-mcp/README.md) |
| `@heroui/native-mcp` | MCP server for React Native (`@heroui/native`) component docs, examples, and theme data |  [README](apps/native-mcp/README.md) |

## Quick Start

### Installation

Choose your package based on your platform:

**For Web (React/Next.js):**
```bash
# Cursor, Claude Code, Windsurf, etc.
npx -y @heroui/react-mcp@latest
```

**For React Native:**
```bash
npx -y @heroui/native-mcp@latest
```

See package-specific READMEs for detailed installation instructions for your IDE.

## What's Included

- 🔍 **Component Discovery** - Search and browse all HeroUI components
- 📚 **Complete Documentation** - Props, types, and usage examples
- 🎨 **Theme Information** - Access theme variables and design tokens
- 💻 **Source Code** - View component implementation and styles
- 🔄 **Always Up-to-Date** - Latest component data fetched automatically

## Local Development

```bash
# Clone and install
git clone https://github.com/heroui-inc/heroui-mcp.git
cd heroui-mcp
pnpm install

# Set up environment variables (required for data extraction)
cp .env.example .env
# Edit .env with your Cloudflare R2 and GitHub credentials
```

### Available Scripts

**Build Commands:**
```bash
pnpm build                    # Build all packages
pnpm build:react              # Build React MCP only
pnpm build:native             # Build Native MCP only
```

**Development Servers:**
```bash
pnpm dev                      # Start all dev servers (excludes mastra)
pnpm dev:react                # React MCP API server (http://localhost:8787)
pnpm dev:native               # Native MCP API server (http://localhost:8788)
pnpm dev:mastra               # Mastra playground server (http://localhost:4111)
```

**Testing & Inspection:**
```bash
pnpm inspect:react            # Launch MCP Inspector for React
pnpm inspect:native           # Launch MCP Inspector for Native
pnpm lint                     # Run linting
pnpm typecheck                # Run type checking
pnpm test                     # Run tests
```

**Data Extraction:**
```bash
pnpm extract:react            # Extract React component data
pnpm extract:native           # Extract Native component data
```

**Code Quality:**
```bash
pnpm format                   # Format code with Prettier
pnpm clean                    # Clean build artifacts
pnpm release:check            # Pre-release validation
```

See [CONTRIBUTING.md](CONTRIBUTING.md) for detailed development setup and architecture information.

## Contributing

We welcome contributions! Please see [CONTRIBUTING.md](CONTRIBUTING.md) for development setup, architecture details, and contribution guidelines.

Please adhere to our [Code of Conduct](CODE_OF_CONDUCT.md) in all interactions.

## Support

- 📖 [Documentation](https://heroui.com)
- 💬 [Discord Community](https://discord.gg/9b6yyZKmH4)
- 🐦 [X (Twitter)](https://x.com/hero_ui)
- 🐛 [GitHub Issues](https://github.com/heroui-inc/heroui-mcp/issues)
- 📧 [Email Support](mailto:support@heroui.com)

## License

[MIT](https://choosealicense.com/licenses/mit/)

## Source & license

This open-source MCP server is cataloged on AgentStack and links to its original source — we do not rehost the code.

- **Author:** [heroui-inc](https://github.com/heroui-inc)
- **Source:** [heroui-inc/heroui-mcp](https://github.com/heroui-inc/heroui-mcp)
- **License:** MIT

Install and usage instructions live in the source repository linked above.

## Pricing

- **Free** — Free

## Security capabilities

Automated source analysis of v0.1.0 — what this tool can access:

- **Network access:** no
- **Filesystem access:** no
- **Shell / process execution:** no
- **Environment & secrets:** yes
- **Dynamic code execution:** no

*"Yes" means the capability is present in the source — more access means more to trust, not that it is unsafe.*


## Versions

- **0.1.0** — security scan: passed — Imported from the upstream source.

## Links

- Listing page: https://agentstack.voostack.com/l/mcp-heroui-inc-heroui-mcp
- Seller: https://agentstack.voostack.com/s/heroui-inc
- Browse the marketplace: https://agentstack.voostack.com/browse

---
Listed on AgentStack — the marketplace for AI agent skills and MCP servers. Every listing is security-reviewed. Creators keep 70%.