How to integrate Magic Patterns MCP with Atomic Agent

Atomic Agent is an open-source AI agent that runs on your machine and supports local models through llama.cpp. Connect it to 1,500+ apps through Composio, including Magic Patterns.

This guide uses Atomic Agent's built-in Composio integration. You need Atomic Agent v0.5.6 or later, your own Composio API key, and a Magic Patterns account. See the Atomic Agent documentation for installation instructions.

How Atomic Agent connects to Magic Patterns

Atomic Agent connects to Composio's Tool Router over Streamable HTTP MCP. It discovers the tools needed for your request, and Composio handles account authentication.

Execution and account-connection tools follow Atomic Agent's configured approval policy. Review any approval prompt before allowing an action on your connected account.

Connect Magic Patterns to Atomic Agent

1. Sign up or sign in to the Composio dashboard. Copy your API key.
2. In Atomic Agent, open the Integrations tab and select Composio. Select API key, press e, paste the key, and press Enter. The tools become available immediately, without a restart.
3. Ask Atomic Agent to do something in Magic Patterns. It searches Composio for the right tool.
4. On first use, open the sign-in link returned in the chat. Connect your Magic Patterns account, then return to Atomic Agent to continue.

Headless setup

Add the following line to ~/.atomic-agent/.env, replacing YOUR_COMPOSIO_API_KEY with your key. Start Atomic Agent after saving the file.

The Magic Patterns MCP server is an implementation of the Model Context Protocol that connects your AI agent and assistants like Claude, Cursor, etc directly to your Magic Patterns account. It provides structured and secure access to your designs, artifacts, design systems, inspiration documents, and slide decks, so your agent can create interfaces, iterate on designs, edit files, inspect progress, and publish artifacts on your behalf.

• Interface design and iteration: Have your agent create a design, send revision prompts to Magic Patterns AI, review recent message history, and check whether generation is still active.
• Artifact editing and publishing: Direct your agent to inspect artifact files, read or overwrite their contents, clone an existing artifact, and publish the finished artifact as the active design.
• Design system management: Let the agent create and list design systems, read or modify their files, and publish the active design system artifact as a new version.
• Inspiration concept development: Instruct your agent to create an inspiration document, add or revise individual concepts with self-contained HTML, or reset every concept when you want to start over.
• Design history and presentation creation: Have your agent review artifact version history, resolve designs from Magic Patterns links, and create AI-generated slide decks.

Use Magic Patterns from Atomic Agent

With your account connected, ask Atomic Agent to work with Magic Patterns in natural language. You can connect more apps through the same Composio integration as you need them.

Visit the Atomic Agent website or inspect the Atomic Agent source code.