The Magic Patterns MCP connector routes your AI agent's tool calls to Magic Patterns's own MCP server through Scalekit. Each user signs in to Magic Patterns once, and Scalekit stores and refreshes their tokens, so your agent never handles credentials. It comes with 50 tools.
- Tools
- 50
- What they doRead · write · destructive
- 14 · 29 · 714 read29 write7 destructive
- Users sign in with
- OAuth
- OAuth app
- Scalekit's or your own
Setup
Install the SDK
Terminal window npm install @scalekit-sdk/node dotenvTerminal window pip install scalekit-sdk-python python-dotenvSet your credentials
Add your Scalekit credentials to your
.envfile. Find values in app.scalekit.com > Developers > API Credentials..env SCALEKIT_ENVIRONMENT_URL=<your-environment-url>SCALEKIT_CLIENT_ID=<your-client-id>SCALEKIT_CLIENT_SECRET=<your-client-secret>Create the Magic Patterns MCP connection
In AgentKit > Connections, create a Magic Patterns MCP connection. The name you give it is the
connection_nameyour code passes. See Configure connections.Scalekit credentials are available for Magic Patterns MCP server, so you don't need to register an OAuth app.
Authorize a user and make your first call
quickstart.mts import { ScalekitClient } from '@scalekit-sdk/node'import 'dotenv/config'import { createInterface } from 'node:readline/promises'const scalekit = new ScalekitClient(process.env.SCALEKIT_ENVIRONMENT_URL,process.env.SCALEKIT_CLIENT_ID,process.env.SCALEKIT_CLIENT_SECRET,)const actions = scalekit.actionsconst connector = 'magicpatternsmcp'const identifier = 'user_123'// Generate an authorization link for the userconst { link } = await actions.getAuthorizationLink({ connectionName: connector, identifier })console.log('Authorize Magic Patterns MCP:', link)const rl = createInterface({ input: process.stdin, output: process.stdout })await rl.question('Press Enter after authorizing...')rl.close()// Make your first callconst result = await actions.executeTool({connector,identifier,toolName: 'magicpatternsmcp_list_design_systems',toolInput: {},})console.log(result)Terminal window npx tsx quickstart.mtsquickstart.py import osfrom scalekit import ScalekitClientfrom dotenv import load_dotenvload_dotenv()scalekit_client = ScalekitClient(env_url=os.getenv("SCALEKIT_ENVIRONMENT_URL"),client_id=os.getenv("SCALEKIT_CLIENT_ID"),client_secret=os.getenv("SCALEKIT_CLIENT_SECRET"),)actions = scalekit_client.actionsconnection_name = "magicpatternsmcp"identifier = "user_123"# Generate an authorization link for the userlink_response = actions.get_authorization_link(connection_name=connection_name,identifier=identifier,)print("Authorize Magic Patterns MCP:", link_response.link)input("Press Enter after authorizing...")# Make your first callresult = actions.execute_tool(tool_input={},tool_name="magicpatternsmcp_list_design_systems",connection_name=connection_name,identifier=identifier,)print(result)Terminal window python quickstart.pyEach user signs in once. See Authorize a user for the full flow and statuses.
Tools
Pass the exact name toexecute_toolmagicpatternsmcp_get_artifactGets the active artifact for a design, including its ID and list of files.Read-onlyGet Artifact
Gets the active artifact for a design, including its ID and list of files. Always call this (or get_design_status) to get the latest active artifact before reading files or creating a new artifact branch.
Inputs
editorIdstringrequired- The editor ID of the design to retrieve the active artifact for.
magicpatternsmcp_get_design_statusGets the current status of a design: whether AI generation is active, the active artifact ID, and available files.Read-onlyGet Design Status
Gets the current status of a design: whether AI generation is active, the active artifact ID, and available files. Call this before starting new work on an existing design, and to poll for completion after create_design (with prompt) or send_prompt. Returns isGenerating, activeArtifactId, and availableFiles.
Inputs
editorIdstringrequired- The editor ID from create_design or get_editor_id_from_url. Use this to identify which design to check status for.
magicpatternsmcp_get_design_systemResolves a design system's active artifact and lists its files.Read-onlyGet Design System
Resolves a design system's active artifact and lists its files. Design systems are collaborative, so the active artifact ID can change between calls; always call this first rather than reusing a cached artifact ID. Returns the artifactId (to pass as baseArtifactId to write_design_system_files), the persisted files, and whether there are unpublished changes.
Inputs
designSystemIdstringrequired- The design system ID (ds-...). Use list_design_systems to discover available design systems.
magicpatternsmcp_get_editor_id_from_urlResolves a Magic Patterns URL to an editor ID.Read-onlyGet Editor ID from URL
Resolves a Magic Patterns URL to an editor ID. Use this when the user shares a Magic Patterns link and you need the editorId for subsequent operations like send_prompt or get_design_status. Supported formats: "magicpatterns.com/c/<id>", "https://www.magicpatterns.com/c/<id>", "project-<slug>.magicpatterns.app", "magicpatterns.com/s/<canvasId>?nodeIds=<nodeId>".
Inputs
urlstringrequired- The Magic Patterns URL to resolve to an editor ID. Supported formats: magicpatterns.com/c/<id>, https://www.magicpatterns.com/c/<id>, project-<slug>.magicpatterns.app, magicpatterns.com/s/<canvasId>?nodeIds=<nodeId>.
magicpatternsmcp_get_inspiration_documentLoads a Magic Patterns inspiration document by its ID.Read-onlyGet Inspiration Document
Loads a Magic Patterns inspiration document by its ID. An inspiration document is a set of design concepts (variants), each a self-contained HTML sketch of a UI direction. Use this to check whether concepts are ready, or to fetch a concept's current html before revising it with inspiration_update_variant.
Inputs
inspirationIdstringrequired- The Magic Patterns inspiration document ID (the <id> in magicpatterns.com/inspiration/<id>).
magicpatternsmcp_list_design_systemsLists the design systems available to the authenticated user, including built-in presets (Base, Shadcn, MUI) and any custom design systems.Read-onlyList Design Systems
Lists the design systems available to the authenticated user, including built-in presets (Base, Shadcn, MUI) and any custom design systems. Use this to resolve a design system name to its ID before calling create_design.
Inputs
This tool takes no inputs.
magicpatternsmcp_list_filesList files on the current page.Read-onlyList Files
List files on the current page. With no arguments, lists every OS file on this page â id, canvas name and kind â along with the shared project files at the OS root, which is the fastest way to orient yourself. The canvas names are only available here, so this is also how you turn a name the user used into the id the other tools take. Pass `osFile` to list the files inside one of them instead: every file, recursively, unless `depth` says otherwise. Returns up to 200 entries per call; if there are more, the output gives the `offset` to continue from. Prefer this over `bash ls` or `find`, which flood the context with every bundle at once.
Inputs
osIdstringrequired- The id of the OS to run against.
depthnumber- Inside an OS file, how many levels deep to show (1 = direct children only); deeper files collapse into their directory. Default: every level.
filterstring- Case-insensitive regex. Inside an OS file it is applied to each file path relative to `path`, e.g. "\\.css$"; at the page level, to each OS file id and canvas name.
offsetnumber- Skip this many entries, to page through a long listing. Default: 0.
osFilestring- The id of an OS file to look inside. Omit to list the OS files themselves.
pathstring- A directory inside `osFile` to list, e.g. "components". Requires `osFile`. Omit to list the whole OS file.
magicpatternsmcp_list_magicos_threadsThe threads MagicOS has handed work to on this OS, newest first: whether each is working, queued, waiting on the user, done, failed, or stopped; what it last said or its recap; the question it is waiting on; and the files it changed, with links.Read-onlyList Magicos Threads
The threads MagicOS has handed work to on this OS, newest first: whether each is working, queued, waiting on the user, done, failed, or stopped; what it last said or its recap; the question it is waiting on; and the files it changed, with links. Use it to follow work you gave MagicOS with ask_magicos. Check about once a minute, not in a tight loop. Costs nothing â it touches no sandbox.
Inputs
osIdstringrequired- The id of the OS to run against.
magicpatternsmcp_list_osList the Magic OSes you can reach, newest first, with the id every other tool takes.Read-onlyList Os
List the Magic OSes you can reach, newest first, with the id every other tool takes. Those tools all need write access, which the permission on each entry tells you whether you have. When you are making something new in one, create_os_file comes right after list_files, before you read or explore anything else: the file appears on the canvas the moment it is made, and until then the user sees nothing happening. A Magic OS is separate from Magic Patterns editor designs at /c/<id>: build what goes in one with the OS tools, never by making an editor design to link in, which cannot be done. A link of the form /os/<osId>/<osFileId> already names both ids.
Inputs
This tool takes no inputs.
magicpatternsmcp_list_positionsList each OS file id, canvas name, kind, and top left on the current page.Read-onlyList Positions
List each OS file id, canvas name, kind, and top left on the current page. Same coordinates as `move_os_file` and `create_os_file`.
Inputs
osIdstringrequired- The id of the OS to run against.
magicpatternsmcp_list_version_historyLists the artifact version history for a design, returning the most recent 20 versions with their artifact IDs, version labels, and titles.Read-onlyList Version History
Lists the artifact version history for a design, returning the most recent 20 versions with their artifact IDs, version labels, and titles. Use skip to paginate backwards. Each version corresponds to a snapshot of the design's code at a point in time.
Inputs
editorIdstringrequired- The editor ID of the design whose version history to list.
skipnumber- Number of recent versions to skip for pagination. Defaults to 0 (most recent). Increment by 20 to paginate backwards through version history.default
0
magicpatternsmcp_read_artifact_filesReads the contents of one or more files from an artifact.Read-onlyRead Artifact Files
Reads the contents of one or more files from an artifact. Always read files before making changes with write_artifact_files. The code is meant as a starting point and should be adapted to the user's project style, frameworks, and conventions.
Inputs
artifactIdstringrequired- The artifact ID to read files from. Obtain this from get_artifact or get_design_status.
fileNamesarrayrequired- Array of file names or paths to read from the artifact. Example: ["App.tsx", "components/Button.tsx"].
magicpatternsmcp_read_design_system_filesReads the contents of one or more files from a design system's active artifact, such as components/<Name>/index.tsx, index.css, tailwind.config.js, or rules/<slug>.md.Read-onlyRead Design System Files
Reads the contents of one or more files from a design system's active artifact, such as components/<Name>/index.tsx, index.css, tailwind.config.js, or rules/<slug>.md. Call get_design_system first to discover available file names, and always read before editing.
Inputs
designSystemIdstringrequired- The design system ID (ds-...).
fileNamesarrayrequired- Array of file names/paths to read, as listed by get_design_system. Example: ["components/Button/index.tsx", "index.css"].
magicpatternsmcp_read_recent_message_historyReads the recent chat item history for a design, returning the last 10 chat items (user prompts, AI responses, artifact versions, edits).Read-onlyRead Recent Message History
Reads the recent chat item history for a design, returning the last 10 chat items (user prompts, AI responses, artifact versions, edits). Use the skip parameter to paginate backwards. Code contents are omitted; use read_artifact_files for full file contents.
Inputs
editorIdstringrequired- The editor ID of the design to read chat history from.
skipnumber- Number of recent items to skip for pagination. Defaults to 0 (most recent). Increment by 10 to paginate backwards through history.default
0
magicpatternsmcp_ask_magicosHand work to MagicOS, this OS's own Magic Patterns design agent, by sending it a message exactly as if the user had typed it into the OS's chat.WriteAsk Magicos
Hand work to MagicOS, this OS's own Magic Patterns design agent, by sending it a message exactly as if the user had typed it into the OS's chat. ONLY when the user has explicitly asked for Magic Patterns' AI, MagicOS, or the OS's agent to do the work. Otherwise do the work yourself with the OS tools: this spends the user's Magic Patterns credits, and takes minutes. What happens: MagicOS reads the message, replies, and hands the work to threads that run inside the OS â new ones, or running ones the message changes. It builds nothing itself, and never asks you clarifying questions; a thread can stop to ask the user something instead. This call waits only until MagicOS has decided where the message goes, usually seconds, and returns its reply and the threads it handed work to. The work carries on after that: follow it with list_magicos_threads. While those threads work, do not edit the files they are on, and do not call finish_working for their work â the canvas rebuilds when they end. A thread waiting on the user is answered through here too: relay its question to the user, send their answer with this tool, and MagicOS passes it on. The message shows in the OS chat as sent by the user through your client.
Inputs
messagestringrequired- What the user wants, in their words, as they would type it to MagicOS. Include what they said about it; add nothing they did not ask for. Name OS files by their canvas names.
osIdstringrequired- The id of the OS to run against.
magicpatternsmcp_bashRun a shell command inside the current page, where each OS file is a directory, or inside one when `osFile` is given.WriteBash
Run a shell command inside the current page, where each OS file is a directory, or inside one when `osFile` is given. Use it for batch work the file tools would make tedious: the same transformation across many files, moving or renaming several files, running a package script, a pipeline whose output you need. A GitHub repository OS file is a read-only mount. Use bash there only for commands that inspect without writing. Do NOT use it to read, search or edit one file â no `cat`, `sed -n`, `grep`, `find`, `sed -i`, heredocs or one-file scripts. `read_file`, `list_files`, `grep`, `edit_file` and `write_file` return better-shaped output for fewer tokens, their errors tell you how to recover, and only their edits show live on the canvas. To make several changes to one file, use one `edit_file` call with `edits`.
Inputs
commandstringrequired- The command to run.
osIdstringrequired- The id of the OS to run against.
purposestringrequired- What this command does, in plain words anyone could follow: start with a bare verb, keep it under six words, and leave out commands, flags, file paths and code names, e.g. 'Check the page fits the screen'. The user sees it as the step's label both while it runs and after it finishes, so do not write 'Checks', 'Checking' or 'Checked'.
osFilestring- Run inside this OS file rather than at the current page root. Paths in the command are then relative to it.
magicpatternsmcp_create_designCreates a new Magic Patterns design.WriteCreate Design
Creates a new Magic Patterns design. With a prompt, kicks off AI generation (poll get_design_status to track progress). Without a prompt, creates a blank design with scaffold files instantly. Optionally fork an existing design via templateId, and specify a design system by name or ID.
Inputs
designSystemstring- Optional design system name (e.g. 'Shadcn', 'MUI'). Resolved case-insensitively. designSystemId takes precedence if both provided.
designSystemIdstring- Optional design system ID. Use list_design_systems to discover IDs.
imageUrlsarray- Optional image URLs as visual references (only used with prompt).
namestring- Optional name for the design. Defaults to 'Untitled'.
promptstring- Optional natural language prompt for AI generation. If omitted, a blank design with scaffold files is created instantly.
templateIdstring- Optional editor ID of an existing design to fork as a template. Get the ID from the design URL or via get_editor_id_from_url.
magicpatternsmcp_create_design_systemCreates a new, blank design system owned by the authenticated user and returns its ID plus editor URL.WriteCreate Design System
Creates a new, blank design system owned by the authenticated user and returns its ID plus editor URL. Seeds an empty initial version so files can be written into it immediately via write_design_system_files. This creates a BLANK design system; forking from an existing one is not supported.
Inputs
namestringrequired- The name of the new design system, e.g. 'Acme Design System'.
logostring- Optional logo URL for the design system. Defaults to a placeholder image if omitted.
magicpatternsmcp_create_inspiration_documentCreates a Magic Patterns inspiration document and returns a shareable magicpatterns.com/inspiration/<id> link that renders 1-8 design concepts side by side.WriteCreate Inspiration Document
Creates a Magic Patterns inspiration document and returns a shareable magicpatterns.com/inspiration/<id> link that renders 1-8 design concepts side by side. Concepts can be declared as placeholders (name/description only) and filled in later with inspiration_add_variant, or published fully in one call by including html inline for each concept.
Inputs
filesarrayrequired- The 1-8 concepts to publish or declare. Each entry is {"name": "...", "description": "...", "html": "..."}; omit html to declare a placeholder concept to fill later via inspiration_add_variant.
baselineobject- Optional baseline the variants diverge from: a faithful recreation of the current UI plus pinned invariants. Shape: {"html": "...", "focus": "...", "sharedCopy": "...", "baselineStyle": "..."}. Only html is required.
repositoryUrlstring- Optional GitHub repository URL the concepts were generated from, kept for context.
titlestring- Optional short label for what the concepts explore, e.g. 'Projects list empty state'.
magicpatternsmcp_create_new_artifactCreates a new artifact by cloning an existing artifact, setting it as the active artifact for the design.WriteCreate New Artifact
Creates a new artifact by cloning an existing artifact, setting it as the active artifact for the design. Use this before making file changes with write_artifact_files so the user can revert to the previous artifact. Always get the current active artifact ID from get_design_status or get_artifact first.
Inputs
artifactIdstringrequired- The artifact ID to clone from (typically the active artifact from get_artifact or get_design_status).
namestringrequired- A short title for this version, phrased as the change about to be made (e.g. 'Swap hero CTA to solid variant'). Shown in the design timeline and versions dropdown.
descriptionstring- Optional longer note on what is about to change and why, shown above the version in chat. Prefer describing what actually shipped via publish_artifact's description instead; use this for a session that may not reach publish.
magicpatternsmcp_create_osCreate a new, empty Magic OS owned by you, and return its id.WriteCreate Os
Create a new, empty Magic OS owned by you, and return its id. This makes a whole OS â to add a design or document to one that already exists, use create_os_file. An empty OS shows the user nothing, so create_os_file its first file straight after, before you explore.
Inputs
namestring- What to call it. Defaults to "Untitled".
magicpatternsmcp_create_os_fileAdd a new file to this OS canvas.WriteCreate Os File
Add a new file to this OS canvas. A "design" is a React app in its own bundle; a "document" is a bundle holding one markdown file; an "image" is a bundle holding one `metadata.json` that points at a hosted image, and it is created blank for the user to upload into; a "text" is a note drawn directly on the canvas as its own words, holding one `metadata.json` with a `text` field â create one only when asked for a label or a note, never to report on your own work. Returns the id to address it by â use that id as `osFile` in later calls. When the work is a new thing, call this as soon as you know it needs one â before you explore, not when you get round to writing. The file appears on the canvas the moment it is made, which is how the user sees the work begin; reading for minutes first leaves them watching nothing. Wait only while you still have to ask the user what to build, or cannot yet tell whether the work is new or a change to a file already there. A design made elsewhere, such as a Magic Patterns editor design at /c/<id>, cannot be linked or embedded on this canvas. To bring one in, read it with `read_magic_patterns_design` and write its code into a file created with this. Pass `copyFrom` with an existing OS file id to copy its kind and exact contents into the new file. Otherwise the new file is scaffolded with a placeholder, so write its real contents afterwards rather than leaving it as created. Where it lands matters. A new design goes to the right of the design it belongs with: pass `nextTo` with that id, and with no placement argument a copy sits to the right of `copyFrom`, otherwise to the right of the file you last worked on, or at the end of the last row when this run has not touched one yet. Pass `newRow: true` only to start a separate row underneath, such as an inspiration set â not for an ordinary new design.
Inputs
namestringrequired- A short human label for the canvas, e.g. "Checkout flow". Not a filename.
osIdstringrequired- The id of the OS to run against.
coordinatesobject- Exact spot on the canvas, as the top-left corner of a 176x152 node. Only for a layout you have actually worked out â prefer `nextTo`, or omit both and it is placed for you. Cannot be combined with `nextTo`.
copyFromstring- The id of an existing OS file to copy exactly. Its kind, every file in its bundle, and its canvas size and layout are preserved; `preset` and `layout` override the last two.
kindstring- What to create. Required unless `copyFrom` is set, in which case the source kind is preserved.one of
canvasprototypeframedocumentimagetext-annotation layoutstring- Design only. "app" is one screen that fits the viewport, such as a dashboard or an app shell whose regions scroll inside it; its canvas node keeps its preset size. "page" is read top to bottom, such as a landing page or an article; its canvas node grows with the content while you write it, so size nothing with viewport units (`h-screen`, `min-h-screen`, `vh`). Defaults to "app".one of
apppage newRowboolean- Start a new row below everything. Only for a separate set that should not sit beside existing work, such as an inspiration exploration. An ordinary new design goes to the right of the design it relates to instead. Later files in the same set go `nextTo` this one. Cannot be combined with `nextTo` or `coordinates`.
nextTostring- The id of the design this one belongs with. It is placed to the right of that file, on the same row, as close as a free spot allows. Omit to sit to the right of the file this one copies, or of the file you last worked on. Cannot be combined with `coordinates`.
parentstring- Prototypes layout only: the id of the file to make this under in the tree. Optional for anything but a "text-annotation", and any file on the page will do: filing is organisation, so it never changes how either builds, except that a prototype plays a frame filed under it. A canvas as `parent` places the new file on that canvas in the same step, below what it already draws, which is what puts it under the canvas: a file is under the canvas that places it, and placed on one canvas only. To show a file on a second canvas, copy it with `copyFrom` and place the copy. Without one, it sits at the top of the page, which is where work on something new belongs: a file the user mentioned only as context is not a parent. With `copyFrom`, omit it to file the copy where its source is.
presetstring- Design or prototype only: the device it is built for. A design opens on the canvas at that size, drawn at real size; a prototype's frames draw at it. "web" (the default) is a 1280 Ã 900 desktop page; use "mobile", a 390 Ã 844 phone screen, when the user asked for a mobile or phone design or app.one of
webmobile
magicpatternsmcp_create_slide_deckCreates a new Magic Patterns slide deck and kicks off AI generation.WriteCreate Slide Deck
Creates a new Magic Patterns slide deck and kicks off AI generation. A slide deck is a 16:9, full-bleed, one-slide-at-a-time React presentation where each slide maps to a screen in the canvas. A prompt is required; generation is long-running, so poll get_design_status rather than waiting synchronously.
Inputs
promptstringrequired- Natural language description of the slide deck to generate, e.g. 'A 10-slide startup pitch deck for a fintech company'.
designSystemstring- Optional design system name (e.g. 'Shadcn', 'MUI'). Resolved case-insensitively. designSystemId takes precedence if both are provided.
designSystemIdstring- Optional design system ID. Use list_design_systems to discover IDs.
imageUrlsarray- Optional image URLs as visual references.
namestring- Optional name for the slide deck. Defaults to 'Untitled'.
magicpatternsmcp_edit_fileApply one or more exact-string replacements to a file, atomically.WriteEdit File
Apply one or more exact-string replacements to a file, atomically. When you have several changes to the same file, pass them together in ONE call via `edits: [{old_string, new_string}, ...]` â do NOT make a separate edit_file call for each. Each `old_string` must match the file byte for byte, including indentation, and must be unique unless that edit sets `replace_all` â include a few surrounding lines to make it so. Edits apply in order and all or nothing: if one does not match, nothing is written. Read the file before editing it. Prefer this over write_file unless you are rewriting most of the file.
Inputs
osIdstringrequired- The id of the OS to run against.
editsarray- The replacements, applied in order, e.g. [{"old_string":"<h1>Old","new_string":"<h1>New"},{"old_string":"text-red-500","new_string":"text-blue-500"}]. PREFERRED whenever you have more than one change to this file. Write each `old_string` as the file reads; edits must not overlap â an earlier `new_string` must not create or remove a later `old_string`.
new_stringstring- The replacement text, used with `old_string`.
old_stringstring- The exact text to replace, for a single replacement only. For more than one, use `edits`.
osFilestring- The id of the OS file that holds this file. Omit to edit a project file at the OS root, such as "package.json".
pathstring- Path within the OS file. Omit for a document. With no `osFile`, a path from the OS root.
replace_allboolean- With `old_string`: replace every occurrence instead of requiring a unique match.
magicpatternsmcp_finish_workingSave what you wrote for the canvas.WriteFinish Working
Save what you wrote for the canvas. The frames the user looks at render a compiled build, which is made once no agent is still working on this OS, so the canvas may not change when this returns. It does not type-check: run `verify` before calling it. Call it when you are done working, before you report back â and on a long run, at any natural stopping point along the way, since each call saves everything written so far. Always pass `title`: it names this version in the user's history.
Inputs
osIdstringrequired- The id of the OS to run against.
titlestring- What you built, as one short line the user will read in their version history, e.g. "Add checkout validation" or "Restyle the pricing page". Name the change, not the act of building it.
magicpatternsmcp_generate_imageGenerate up to 5 images from a description, concurrently, and get back permanent CDN URLs.WriteGenerate Image
Generate up to 5 images from a description, concurrently, and get back permanent CDN URLs. Use it for imagery a design needs and does not have â a hero photograph, a texture, an avatar, an illustration â instead of a grey placeholder box, and for imagery that is the deliverable itself: a mood board, colour directions, several options to choose between. Ask for everything you need in ONE call. The images are generated in parallel, so five in one call costs about what one does, and asking five times over does not. Set `addToCanvas` when the pictures are the point, and each one becomes an image file on the canvas the user can see and move. Leave it off when they are assets for a design, and use the returned URLs as the `src`. `referenceImages` generates FROM pictures rather than only from words â matching a style, keeping a subject, editing an existing image. Pass the id of an image on this canvas, or a Magic Patterns CDN URL. Read an image first if you need to know what it shows.
Inputs
imagesarrayrequired- Every image to generate, up to 5, produced concurrently.
osIdstringrequired- The id of the OS to run against.
addToCanvasboolean- Also add each image to the canvas as its own image file, placed in a row. For images that are the deliverable. Leave it off for assets a design will reference by URL.
nextTostring- The id of an OS file the new images belong to the right of, when `addToCanvas` is set. Omit and the first sits to the right of the file you last worked on, or at the end of the last row.
parentstring- Prototypes layout only: the id of the file to file each image under in the tree, as its own image file â a prototype, or any other file on the page. Implies `addToCanvas`; cannot be combined with `nextTo`.
magicpatternsmcp_globFind files by path pattern inside an OS file.WriteGlob
Find files by path pattern inside an OS file. Matches against the full path relative to `path` (or to the OS file) and returns the matches sorted alphabetically. Supports `*` (any run of chars except `/`), `**` (any run including `/`), `?` (single char), and `{a,b}` alternation. Patterns are anchored to the full path and case-sensitive, e.g. "**/*.stories.*", "src/components/**", "**/*.{ts,tsx}". Hidden files are included, so `.storybook/` and `.cursor/` show up. Returns up to 200 paths per call; if there are more, the output gives the `offset` to continue from. Prefer this over paging through `list_files`, or `bash find`, when you know the shape of the path.
Inputs
osFilestringrequired- The id of the OS file to look inside.
osIdstringrequired- The id of the OS to run against.
patternstringrequired- Glob matched against each file path, e.g. "**/*.stories.*".
offsetnumber- Skip this many matches, to page through a long result. Default: 0.
pathstring- A directory inside `osFile` to search under, e.g. "sources". Paths come back relative to it.
magicpatternsmcp_grepSearch file contents with a regular expression, across the current page by default or within one OS file when `osFile` is given.WriteGrep
Search file contents with a regular expression, across the current page by default or within one OS file when `osFile` is given. This is how you find where something is defined or used before editing it â searching the current page is cheap and cross-OS-file imports are common. Case-insensitive. Each match comes with its line number and 2 lines either side, which is usually enough to write an edit_file without reading the whole file. Returns up to 100 matches â if you hit the cap, narrow the pattern, or scope it with `path` or `glob`. Long lines are truncated to 500 characters. To pull a specific slice of a very long line, use `bash` with `cut -c` or `sed`; it has its own output cap.
Inputs
osIdstringrequired- The id of the OS to run against.
patternstringrequired- A regular expression, in ripgrep syntax.
globstring- Only search paths matching this glob, e.g. "*.tsx".
osFilestring- Restrict the search to one OS file. Omit to search the current page.
pathstring- Narrow the search inside `osFile`: a directory searches everything under it, a file searches just that file. Requires `osFile`.
uploadstring- A file the user attached in chat, by the `upload` path its message listed, e.g. "abc123/pricing.html". Read-only, and not part of the OS. Cannot be combined with `osFile` or `path`.
magicpatternsmcp_grep_magic_patterns_designSearch source files in a separate Magic Patterns design with a JavaScript regular expression.WriteGrep Magic Patterns Design
Search source files in a separate Magic Patterns design with a JavaScript regular expression. Use this to locate definitions and usages before reading whole files.
Inputs
osIdstringrequired- The id of the OS to run against.
querystringrequired- Regex pattern to search for in file contents.
editorIdstring- A Magic Patterns design editor id.
filePatternstring- Optional case-insensitive substring filter for file names.
head_limitinteger- Optional maximum number of matches to return.
offsetinteger- Optional number of matches to skip.
urlstring- A Magic Patterns design URL.
magicpatternsmcp_inspiration_add_variantFills in one concept of an existing Magic Patterns inspiration document with its self-contained HTML.WriteInspiration Add Variant
Fills in one concept of an existing Magic Patterns inspiration document with its self-contained HTML. Use after create_inspiration_document to stream concepts in one at a time: the concept renders live on the shared page as soon as its html arrives, and the document flips to 'ready' once every concept is filled.
Inputs
htmlstringrequired- The full, self-contained HTML document (non-empty).
inspirationIdstringrequired- The inspiration document ID returned by create_inspiration_document.
descriptionstring- Optional update to the concept's design direction.
namestring- Optional update to the concept's name.
variantIdstring- The concept ID to fill, from create_inspiration_document. Omit to fill the first still-empty concept.
magicpatternsmcp_move_os_fileMove an OS file already on this canvas.WriteMove Os File
Move an OS file already on this canvas. The client sees the change immediately. Pass `nextTo` to join another file's row, or `coordinates` for an exact top-left. Call `list_positions` first if you have not worked out the layout. Cannot be combined: pass one of `nextTo` or `coordinates`, not both, and not neither.
Inputs
osFilestringrequired- The id of the OS file to move.
osIdstringrequired- The id of the OS to run against.
coordinatesobject- Exact spot on the canvas, as the top-left corner of a 176x152 node. Only for a layout you have actually worked out â prefer `nextTo`. Cannot be combined with `nextTo`.
nextTostring- The id of an OS file this one belongs beside â a variant of it, the next screen in the flow it starts. It joins that file's row. Cannot be combined with `coordinates`.
magicpatternsmcp_preview_designUse sparingly to visually verify layout, styling, or other appearance-dependent work.WritePreview Design
Use sparingly to visually verify layout, styling, or other appearance-dependent work. This tool can only be called after `finish_working`. Its full-size screenshot can take up to 15 seconds to become available; it returns only that MCP session's exact finished build and never substitutes a thumbnail or an older screenshot.
Inputs
osFilestringrequired- The id of the design to look at, as `list_files` lists it.
osIdstringrequired- The id of the OS to run against.
magicpatternsmcp_publish_artifactCompiles an artifact's source files and sets it as the active artifact for the design.WritePublish Artifact
Compiles an artifact's source files and sets it as the active artifact for the design. This is the final step in the code-first workflow — it bundles files for preview, updates the active artifact in the editor, and adds a version entry to the design timeline.
Inputs
artifactIdstringrequired- The artifact ID to compile and publish.
editorIdstringrequired- The editor ID of the design this artifact belongs to.
descriptionstring- A summary of what changed in this version, written like a commit message in the past tense describing what actually shipped, e.g. 'Swapped the hero CTA to the solid Button variant and dropped the legacy grid'. Always provide this: collaborators open the design without having seen the session, and this is the only prose explaining what changed.
magicpatternsmcp_publish_design_systemPublishes the design system's active artifact as a new immutable version.WritePublish Design System
Publishes the design system's active artifact as a new immutable version. Strict: refuses if the active artifact has validation errors from write_design_system_files; clear all validationErrors first. Returns the new version (major.minor) and whether it is backwards-compatible with the previously published version (a breaking change, such as a removed component or prop, bumps the major version).
Inputs
designSystemIdstringrequired- The design system ID (ds-...).
magicpatternsmcp_read_fileRead a file and return it with line numbers, so you can cite `path:line`.WriteRead File
Read a file and return it with line numbers, so you can cite `path:line`. Files longer than 1500 lines are truncated â pass `offset` (1-based) and `limit` to page through the rest. Lines longer than 500 characters are truncated. To pull a specific slice of a very long line, use `bash` with `cut -c` or `sed`; it has its own output cap. Use this rather than `bash cat`, which returns no line numbers and no truncation notice.
Inputs
osIdstringrequired- The id of the OS to run against.
limitnumber- Maximum lines to return. Defaults to 1500.
offsetnumber- First line to return, 1-based. Defaults to 1.
osFilestring- The id of the OS file that holds this file. Omit to read a project file at the OS root, such as "package.json".
pathstring- Path within the OS file, e.g. "App.tsx". Omit for a document, which is one markdown file. With no `osFile`, a path from the OS root.
uploadstring- A file the user attached in chat, by the `upload` path its message listed, e.g. "abc123/pricing.html". Read-only, and not part of the OS. Cannot be combined with `osFile` or `path`.
magicpatternsmcp_read_magic_patterns_designGet a quick overview of a separate Magic Patterns design from its URL or editor id.WriteRead Magic Patterns Design
Get a quick overview of a separate Magic Patterns design from its URL or editor id. Returns its active artifact, full file list with line counts, and a small entry-file preview. Call this first before searching or reading specific files.
Inputs
osIdstringrequired- The id of the OS to run against.
editorIdstring- A Magic Patterns design editor id.
urlstring- A Magic Patterns design URL.
magicpatternsmcp_read_magic_patterns_design_filesRead specific source files from a separate Magic Patterns design.WriteRead Magic Patterns Design Files
Read specific source files from a separate Magic Patterns design. Use after the overview or grep tool, and use offset and limit for targeted slices of large files. Reads up to five files per call.
Inputs
filesarrayrequired- No description.
osIdstringrequired- The id of the OS to run against.
editorIdstring- A Magic Patterns design editor id.
urlstring- A Magic Patterns design URL.
magicpatternsmcp_read_os_guideHow to build in this OS.WriteRead Os Guide
How to build in this OS. Call it before you create or write anything in an OS. Returns the conventions MagicOS itself follows there: what a prototype, a frame and a canvas are, the shape of their files, how files import each other by id and share code through shared/, how a prototype plays its frames, how a canvas places files, and how variants go on a canvas. Costs nothing â it touches no sandbox. You work from outside the OS, so nothing is selected for you: where those conventions speak of the selected or open thing, it is the file the user names, or the one their /os/<osId>?file=<osFileId> link points at. Where they speak of <os_contents>, list_files with no osFile is yours: it lists every file by name, under the file it is filed under, which is how you turn a name into an id.
Inputs
osIdstringrequired- The id of the OS to run against.
magicpatternsmcp_send_feedback_to_magic_patterns_teamSends feedback straight to the Magic Patterns team.WriteSend Feedback To Magic Patterns Team
Sends feedback straight to the Magic Patterns team. The people who build Magic Patterns and this MCP server read every message, and it is how they find out what to fix. Two kinds, and both are wanted: - Your own, as the agent (from: "agent"). Send it when a Magic Patterns tool errored, returned something confusing or incomplete, ignored an argument, made you retry or work around it, or could not do something your user needed â even if you recovered and finished the task. You see problems your user never does, and reporting them gets them fixed for everyone driving an agent through the same thing. - Your user's (from: "user"). Send it when your user asks you to pass something on to Magic Patterns, or says something about Magic Patterns worth passing on: a bug, a request, praise. Relay it in their words. Send once per distinct issue, not once per retry. Say what you were trying to do, what you expected, what happened, and any workaround, with the ids or links involved (editorId, osId, magicpatterns.com URLs). Never include secrets, API keys, or tokens. Tell your user what you sent. Changes nothing in any design or OS.
Inputs
feedbackstringrequired- The feedback, in plain language. For a problem: what you were trying to do, what you expected, what happened, and any workaround, with the ids or links involved.
fromstringrequired- "agent" for something you ran into yourself; "user" when relaying what your user said.one of
agentuser categorystring- What kind of feedback this is.one of
bugconfusingfeature_requestpraiseother toolNamestring- The Magic Patterns tool this is about, if any.
magicpatternsmcp_set_os_file_layoutSet an existing design's layout, and optionally resize its canvas node to a preset.WriteSet Os File Layout
Set an existing design's layout, and optionally resize its canvas node to a preset. "app" is one screen that fits the viewport, such as a dashboard or an app shell whose regions scroll inside it; its canvas node keeps its preset size. "page" is read top to bottom, such as a landing page or an article; its canvas node grows with the content while you write it, so size nothing with viewport units (`h-screen`, `min-h-screen`, `vh`). A design from before layouts existed is drawn small; giving it one also opens it at real size, at `preset` or the web preset.
- Idempotent
Inputs
layoutstringrequired- How the design is laid out on the canvas.one of
apppage osFilestringrequired- The id of the design.
osIdstringrequired- The id of the OS to run against.
presetstring- Resize the node to this preset, drawn at real size: "web" is a 1280 Ã 900 desktop page, "mobile" is a 390 Ã 844 phone screen. Omit to keep its current size.one of
webmobile
magicpatternsmcp_set_statusTell anyone watching this OS what you are working on.WriteSet Status
Tell anyone watching this OS what you are working on. Your edits show up on their canvas as they land, but without this they have no idea what you are doing or how long to wait, so set it when you start and again whenever the work turns to something else. Costs nothing â it touches no sandbox. finish_working clears it.
- Idempotent
Inputs
osIdstringrequired- The id of the OS to run against.
summarystringrequired- One short line, in plain language, about what you are doing right now â "rewriting the checkout flow", not "calling edit_file". It is shown to a person, not parsed.
newRequestboolean- True when you are starting on a new request from your user, rather than moving to the next step of the one you are on. Your work is shown on the OS grouped by request, and this starts the next group, headed by this summary.
osFilesarray- The OS file ids this work is about, if you know them up front. Their frames are marked as being worked on. Optional: the files you actually touch are picked up on their own.
magicpatternsmcp_verifyType-check every OS file in this OS and report what is broken.WriteVerify
Type-check every OS file in this OS and report what is broken. Run this after a set of edits and before you finish: it catches imports that no longer resolve, renamed exports, and changed prop shapes, which otherwise reach the user as a blank preview. It does not build or run anything, so it is fast and safe to call repeatedly.
Inputs
osIdstringrequired- The id of the OS to run against.
magicpatternsmcp_write_fileCreate a file or replace its entire contents.WriteWrite File
Create a file or replace its entire contents. To change part of an existing file prefer edit_file â a full rewrite risks dropping code you did not intend to touch.
Inputs
contentstringrequired- The full file contents.
osIdstringrequired- The id of the OS to run against.
osFilestring- The id of the OS file to write into. Omit to write a project file at the OS root, such as "package.json".
pathstring- Path within the OS file, e.g. "components/Card.tsx". Omit for a document. With no `osFile`, a path from the OS root.
magicpatternsmcp_delete_fileDelete one file from inside an OS file, or a project file at the OS root when `osFile` is omitted.DestructiveDelete File
Delete one file from inside an OS file, or a project file at the OS root when `osFile` is omitted. To remove a whole design or document, use delete_os_file instead.
Inputs
osIdstringrequired- The id of the OS to run against.
pathstringrequired- Path within the OS file, or from the OS root when `osFile` is omitted.
osFilestring- The id of the OS file that holds this file. Omit to delete a project file at the OS root.
magicpatternsmcp_delete_os_fileRemove a whole file from this OS canvas, including everything inside it.DestructiveDelete Os File
Remove a whole file from this OS canvas, including everything inside it. This is not how you delete one file within a design â use delete_file for that. Other OS files may import this one, so check with grep before removing it.
Inputs
osFilestringrequired- The id of the OS file to remove.
osIdstringrequired- The id of the OS to run against.
magicpatternsmcp_inspiration_clear_variantsResets every concept of an existing Magic Patterns inspiration document back to an empty placeholder, dropping each concept's html and its pre-created 'Iterate' room.DestructiveInspiration Clear Variants
Resets every concept of an existing Magic Patterns inspiration document back to an empty placeholder, dropping each concept's html and its pre-created 'Iterate' room. Use this to replace all concepts: clear the document, then stream fresh concepts back in with inspiration_add_variant targeting the returned concept IDs.
Inputs
inspirationIdstringrequired- The inspiration document ID returned by create_inspiration_document.
magicpatternsmcp_inspiration_update_variantRevises a single already-filled concept of a Magic Patterns inspiration document in place, replacing its html (and optionally its name/description).DestructiveInspiration Update Variant
Revises a single already-filled concept of a Magic Patterns inspiration document in place, replacing its html (and optionally its name/description). Use to update a subset of concepts without touching the others; the concept's 'Iterate in Magic Patterns' room is refreshed so it builds from the new html.
Inputs
htmlstringrequired- The full, self-contained HTML document (non-empty).
inspirationIdstringrequired- The inspiration document ID.
variantIdstringrequired- The concept ID to revise, from get_inspiration_document. Targets an existing filled concept (unlike inspiration_add_variant, which fills empty placeholders).
descriptionstring- Optional update to the concept's design direction.
namestring- Optional update to the concept's name.
magicpatternsmcp_send_promptSends a natural language prompt to the Magic Patterns AI for an existing design.DestructiveSend Prompt
Sends a natural language prompt to the Magic Patterns AI for an existing design. The AI generates or updates code and returns immediately with a requestId. Call get_design_status to poll until isGenerating is false. Generation typically takes 2-10 minutes; poll no more than once every 60 seconds.
Inputs
editorIdstringrequired- The editor ID of the design to update.
promptstringrequired- A natural language description of what to create or change.
magicpatternsmcp_write_artifact_filesCreates or overwrites one or more files in an artifact.DestructiveWrite Artifact Files
Creates or overwrites one or more files in an artifact. If a file exists it will be replaced; if it does not exist it will be created. This only saves source files — call publish_artifact after finishing all file changes to compile and activate the artifact.
Inputs
artifactIdstringrequired- The artifact ID to write files to.
filesarrayrequired- Array of files to write.
magicpatternsmcp_write_design_system_filesCreates or overwrites files in a design system.DestructiveWrite Design System Files
Creates or overwrites files in a design system. Incoming files are validated, merged onto the existing artifact (existing files are preserved), compiled, and activated immediately. Components must use the complete trio: components/<Name>/index.tsx, components/<Name>/<Name>.previews.tsx, and components/<Name>/Context.md. Pass the artifactId from get_design_system as baseArtifactId to detect drift; a 409 means someone else changed the design system in the meantime.
Inputs
designSystemIdstringrequired- The design system ID (ds-...).
filesarrayrequired- Array of files to create or overwrite, e.g. [{"fileName": "components/Button/index.tsx", "content": "export function Button() {...}"}].
baseArtifactIdstring- The artifactId from get_design_system. If the active artifact has since changed, the write is rejected with a 409 so it can be re-read and retried.
No tools match.
