Petal Components MCP
Phoenix LiveView component schemas from petal_components, exposed to AI coding assistants.
Connect it
Settings → Connectors → Add custom connector
URL: https://mcp.petal.build/mcpSettings → Apps & Connectors → Advanced → Developer mode
Create connector with URL: https://mcp.petal.build/mcp{
"mcpServers": {
"petal-components-mcp": {
"url": "https://mcp.petal.build/mcp"
}
}
}claude mcp add --transport http petal-components-mcp https://mcp.petal.build/mcp{
"servers": {
"petal-components-mcp": {
"type": "http",
"url": "https://mcp.petal.build/mcp"
}
}
}{
"mcpServers": {
"petal-components-mcp": {
"command": "npx",
"args": [
"-y",
"petal-components-mcp@0.1.0"
]
}
}
}claude mcp add petal-components-mcp -- npx -y petal-components-mcp@0.1.03 tools, verified live
get_install_instructionsGet 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
list_componentsList 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.
get_componentGet 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.
Alternatives in Developer Tools
Compare →DMDocs MCPA
Remote MCP server for Tandem docs, install guides, SDKs, workflows, and agent setup help.
SHShipSwiftA
40+ production-ready SwiftUI recipes for building full-stack iOS apps via MCP.
Limitguard Lead VerificationA
Lead validation over MCP: KVK/KBO register, EU VAT, sanctions and email checks with sources.
Tailwind ShadesA
Tailwind CSS palettes (50-950) from any color, the closest Tailwind color, and Tailwind's defaults
three.ws for GrokA
Free text/image to 3D for Grok Bot, plus your three.ws agents once signed in. Never spends.
MGMCP GrafanaA
An MCP server giving access to Grafana dashboards, data and more.