Give your AI coding agent an architecture canvas to design and evolve diagrams.
{
"mcpServers": {
"composer": {
"url": "https://mcp.usecomposer.com",
"type": "http"
}
}
}Are you the author?
Add this badge to your README to show your security score and help users find safe servers.
Give your AI coding agent an architecture canvas. Design, visualize, and evolve software architecture diagrams - right from your IDE.
Is it safe?
No known CVEs for @usecomposer/mcp.
No authentication — any process on your machine can connect.
License not specified.
Is it maintained?
Last commit 1 days ago. 3 stars.
Will it work with my client?
Transport: stdio, http. Works with Claude Desktop, Cursor, Claude Code, and most MCP clients.
Run this in your terminal to verify the server starts. Then let us know if it worked — your result helps other developers.
npx -y '@usecomposer/mcp' 2>&1 | head -1 && echo "✓ Server started successfully"
After testing, let us know if it worked:
No known vulnerabilities.
Have you used this server?
Share your experience — it helps other developers decide.
Sign in to write a review.
A mcp server to allow LLMS gain context about shadcn ui component structure,usage and installation,compaitable with react,svelte 5,vue & React Native
AI-powered brand identity generation via MCP with design tokens, typography, and logo assets.
I Ching hexagram analysis and geographic feng shui for Taiwan locations
Peekaboo is a macOS CLI & optional MCP server that enables AI agents to capture screenshots of applications, or the entire system, with optional visual question answering through local or remote AI models.
MCP Security Weekly
Get CVE alerts and security updates for io.github.OliverGrabner/composer and similar servers.
Start a conversation
Ask a question, share a tip, or report an issue.
Sign in to join the discussion.
Composer MCP Server
Give your AI coding agent an architecture canvas.
Design, visualize, and evolve software architecture diagrams - right from your IDE.
Composer is a visual system design tool that lets AI coding agents create and modify interactive architecture diagrams through MCP (Model Context Protocol). Your agent gets tools to add services, databases, queues, and connections, and you get a live canvas at usecomposer.com that updates in real-time.
Your IDE <--> MCP Server (this package) <--> Composer API <--> Your Diagram
Claude Code:
claude mcp add --transport http composer https://mcp.usecomposer.com
Cursor — create .cursor/mcp.json in your project root:
{
"mcpServers": {
"composer": {
"type": "http",
"url": "https://mcp.usecomposer.com"
}
}
}
Your browser will open for authorization on first use.
claude mcp add --transport http composer https://mcp.usecomposer.com
Create .cursor/mcp.json in your project root:
{
"mcpServers": {
"composer": {
"type": "http",
"url": "https://mcp.usecomposer.com"
}
}
}
codex mcp add composer -- npx -y @usecomposer/mcp --stdio
Create .vscode/mcp.json in your project root:
{
"servers": {
"composer": {
"type": "http",
"url": "https://mcp.usecomposer.com"
}
}
}
Open Cline sidebar > Settings (gear icon) > MCP Servers > Add Remote Server:
{
"mcpServers": {
"composer": {
"type": "http",
"url": "https://mcp.usecomposer.com"
}
}
}
Add to .continue/config.yaml:
mcpServers:
- name: composer
url: https://mcp.usecomposer.com
Add to ~/.codeium/windsurf/mcp_config.json:
{
"mcpServers": {
"composer": {
"serverUrl": "https://mcp.usecomposer.com"
}
}
}
Note: Windsurf uses
"serverUrl"instead of"url".
Create opencode.json in your project root:
{
"mcp": {
"composer": {
"type": "remote",
"url": "https://mcp.usecomposer.com"
}
}
}
| Tool | Description |
|---|---|
list_diagrams | List all your diagrams. Call this first to find which diagram to work on |
create_diagram | Create a new diagram and auto-select it for this session |
select_diagram | Select which diagram to work on for this session |
rename_diagram | Rename the currently selected diagram |
Note: Call
list_diagramsthenselect_diagram(o