Watermelon UI MCP

The hosted Watermelon UI MCP searches free React and Tailwind components, blocks and dashboards and returns source code.

  • 215 ★ on the repository
  • Last commit
  • MIT
MCP serverOfficial

Minimal access

Why this level

  • Agent search queries go to the hosted mcp.watermelon.sh server.
All reasons and checks

watermeloncorp/watermelon-platform

Install

In your terminal, with SkillFoxx CLI

npx skillfoxx add mcp/watermelon-ui-mcp

Detects the agents on your machine, shows the access level and pins the version.

Other ways to install

Access and checks

How we review

Minimal accessThe tool runs nothing and makes no network calls.

  • Agent search queries go to the hosted mcp.watermelon.sh server.

This is third-party code. Review the repository files before installing.

What it does

Watermelon UI is an open catalog of components, animated components, blocks, dashboards and templates for React and Tailwind. The address `https://mcp.watermelon.sh/mcp` connects it to an agent without an API key. The repository also holds a local variant (`bun run mcp`, stdio) and a Cloudflare worker. Tools: `search` searches the whole catalog, `get_component` returns an entry with preview, dependencies, install command and source files, `get_inspiration` suggests three to six visually fitting options for a goal, `compose_page` builds a page plan from compatible blocks per section (navigation, hero, pricing, testimonials, FAQ, footer), `list_categories` and a summary tool show categories and entry counts. Components install as shadcn registry items and the code stays in your project.

Who it is for. Frontend developers and designers building interfaces on React, Tailwind and shadcn who want an agent to pull ready blocks from a catalog.

Good fit when

  • The agent needs a pricing block or a hero section: it searches the catalog and takes the source.
  • A landing page plan is composed from compatible blocks per section.
  • Before choosing a design, three to six options for a goal such as a SaaS dashboard are requested.
  • The project is on shadcn: a component is installed with a registry command and edited in your code.

Not a fit when

  • The project is not on React and Tailwind: the catalog targets this stack.
  • Only guidance on a specific library is needed: Watermelon is a catalog of its own components.
  • Outgoing requests are blocked: the hosted server is reached at mcp.watermelon.sh.

Example request

Find a SaaS pricing block in Watermelon, show its source and install command, then compose a landing page plan from fitting blocks.

MCP

Transport
http, stdio
Authentication
not required

Limitations

No API key is needed, but the hosted server sends the agent search queries to mcp.watermelon.sh. The local variant runs from a cloned repository with `bun run mcp`. Components ship under the repository license (MIT), the code is copied into the project and maintained by you from then on. The server serves code from the Watermelon catalog itself rather than third-party libraries, so the choice is limited to what is published there. Before copying into a project, review the dependencies that `get_component` returns.

How to disable. Run `claude mcp remove watermelon` or delete the entry from the client config. Components already added to the project stay in the code.

FAQ

How do I connect Watermelon UI MCP to Claude Code?

With `claude mcp add --transport http watermelon https://mcp.watermelon.sh/mcp`. For Codex use `codex mcp add watermelon --url https://mcp.watermelon.sh/mcp`.

Is an API key required?

No, the hosted server works without a key or sign-up.

Which entry types does the catalog have?

Components, animated components, blocks, dashboards and templates.

How is a component installed?

As a shadcn registry item: `npx shadcn@latest add` with an address from `registry.watermelon.sh`, the source is copied into the project.

Does the server run locally?

Yes, from a cloned repository run `bun run mcp` (stdio). The hosted Cloudflare worker runs with `bun run mcp:dev` and deploys with `bun run mcp:deploy`.

Discussion

No questions or reviews yet.

Official

21st.dev MCP server and plugin: search ready React/Tailwind components and logos and generate UI from your agent

MCP serverExtended access6.5KRepository stars
Official

MCP server for the UI Beats catalog of animated React components: search, props, source code and install command for an agent

MCP serverMinimal access235Repository stars

Shadcn UI MCP Server

Shadcn UI v4 MCP Server

An MCP server that gives the agent shadcn/ui component source, demos and blocks for React, Svelte, Vue and React Native

MCP serverExtended access3.1KRepository stars

The Arc UI MCP server: an agent searches animated React components, reads docs and props and gets the shadcn install command.

MCP serverMinimal access1.3KRepository stars

Lightswind UI

Lightswind-UI-Library

A library of animated React components the CLI copies into the project as source, with an MCP server. Some blocks are under a paid Pro license

CLIExtended access1.3KRepository stars
Official

MCP server of a React component library for agent interfaces: the agent finds a component and adds it to your project

MCP serverExtended access750Repository stars

README in short

The README describes the ui.watermelon.sh platform: the stack (React 19, Vite, Tailwind 4), the content model, development commands, component installation through the shadcn registry and connecting the hosted MCP with one command for Claude Code and Codex.

README badge

Report a problem