mcpbeat

Petal Components MCP Server

io.github.petalframework/petal-components-mcp
answering

Petal Components MCP is answering right now. Last checked 2 min ago. 33 installs a week from npm. It exposes 3 tools. Last commit 4 Aug 2026.

Phoenix LiveView component schemas from petal_components, exposed to AI coding assistants.

Installs per day peak 23 · avg 6 · -42% w/w
a month agotoday
Uptime history 40 hours of history
40 hours agonow
100.0%
Uptime 24h
92 of 92 checks
3
Tools
read from the server
498 ms
Response time
average over 24h
33
Installs / week
npm and PyPI

Connect this server

Endpoint below is the one we actually reach during checks — not the one copied from a README. Last verified 2 min ago.

run in your terminal
claude mcp add petal-components-mcp --transport http https://mcp.petal.build/mcp
~/Library/Application Support/Claude/claude_desktop_config.json
{
  "mcpServers": {
    "petal-components-mcp": {
      "url": "https://mcp.petal.build/mcp"
    }
  }
}
~/.codex/config.toml
[mcp_servers.petal-components-mcp]
url = "https://mcp.petal.build/mcp"
.cursor/mcp.json
{
  "mcpServers": {
    "petal-components-mcp": {
      "url": "https://mcp.petal.build/mcp"
    }
  }
}
.vscode/mcp.json
{
  "mcpServers": {
    "petal-components-mcp": {
      "url": "https://mcp.petal.build/mcp"
    }
  }
}

Available tools 3

Read directly from the server with tools/list, grouped by what they act on. If a tool disappears, we record the date.

component
get_component
Get the full schema for one petal_components component: attrs, slots, defaults, allowed values, and a working HEEx usage example. Call this every time you are about to write a tag like <.button>, <.modal>, <.table>, or <.field> so the attrs and slots match the real library instead of training-data guesses.
components
list_components
List every component shipped by petal_components, the shadcn-style component library for Phoenix LiveView. This is the canonical Phoenix UI vocabulary - call it before composing any HEEx so you reach for an existing component instead of hand-rolling Tailwind divs.
install
get_install_instructions
Get the canonical steps for installing petal_components in a Phoenix project. Call this when the user asks to install petal_components, when you are setting up a new Phoenix project that needs UI components, or when verifying an existing installation. Returns step-by-step instructions covering mix.exs, mix deps.get, Tailwind v4 CSS config, and the web module import. Steps are idempotent - safe to follow on a project that is partially configured.

Endpoints

URLTransportStateLatencyChecked
https://mcp.petal.build/mcp streamable-http answering 435 ms 2 min ago

Petal Components MCP — questions

Answers built from our own checks of this server.

What can Petal Components MCP do?
It exposes 3 tools, read directly from the server on our last check. Among them: get_component, get_install_instructions, list_components. The full list with descriptions is on this page — we take it from the server itself via tools/list, not from a README. How MCP servers expose tools in the first place →
Is Petal Components MCP working right now?
We send a real MCP handshake every 15 minutes. Over the last 24 hours 92 of 92 checks got a reply (100.0%), average response time 498 ms. The bar chart above shows every period we have measured.
How do I connect Petal Components MCP?
Copy the ready config from this page — we generate it for Claude Code, Claude Desktop, Codex, Cursor and VS Code, each with the file path that client actually reads. It is a remote server, so there is nothing to install — the client connects to the address.
Does Petal Components MCP need an API key?
No. Petal Components MCP completed a full MCP handshake with us as an anonymous client and listed its tools without asking for anything. All 3 of them are readable on this page. This is what we observed, not what the docs claim.
How fast is Petal Components MCP?
It answers our handshake in 498 ms on average, which is faster than 22% of all working MCP servers we measure. That is on the slow side — worth knowing if the tool sits inside an interactive loop. The comparison comes from our own checks across the whole registry, every 15 minutes.
How many people use Petal Components MCP?
The npm package petal-components-mcp was installed 33 times in the last week. Week over week that is -42%. We show installs rather than GitHub stars on purpose: a star is a bookmark, an install is someone actually running it.
Is Petal Components MCP open source?
Yes — it is published under the MIT licence, written in TypeScript and 0 stars on GitHub. The source link is on this page, so you can read exactly what it does with your data before you connect it.