Connect an agent

Shape tools for coding agents

Back to Studio

Material shape tools for your coding agent

Let Claude Code, Codex, Cursor or any agent that runs commands create, preview and export Material 3 Expressive shapes, and hand you editable Studio links.

1 Quickest: ask your agent

Paste this into your agent. It reads the instructions, picks the right install method and asks for your approval.

Install the Material Shape Studio shape tools for me by following https://kartollikaa.github.io/material-shape-studio/connect/agent.txt. Use the first install method my agent host supports, keep my existing settings, and ask me before anything that needs my approval. Then create a test shape and give me its editable Studio link.

2 Or install it yourself

Claude Code Plugin from the marketplace

  1. In a Claude Code session, type

    /plugin install material-shape-studio --marketplace kartollikaa/material-shape-studio

  2. Or from a terminal, which an agent can run for you

    claude plugin marketplace add kartollikaa/material-shape-studio
claude plugin install material-shape-studio@material-shape-studio

  3. Prefer MCP tools over the plugin? Register the local server instead

    claude mcp add --transport stdio material-shape-studio -- npx --yes material-shape-studio-mcp@0.1.3

The one-line slash command needs Claude Code 2.1.275 or newer.

Codex Plugin from the marketplace

  1. In a terminal, add the marketplace

    codex plugin marketplace add kartollikaa/material-shape-studio

  2. In Codex, open the plugin browser and install Material Shape Studio

    /plugins

Start a new Codex session to load the plugin's skill.

Cursor Local MCP server

Add to Cursor

  1. Or merge this entry into mcpServers in ~/.cursor/mcp.json

    {
  "mcpServers": {
    "material-shape-studio": {
      "command": "npx",
      "args": [
        "--yes",
        "material-shape-studio-mcp@0.1.3"
      ]
    }
  }
}

Keep your existing servers; add this one next to them.

Any other agent Local CLI, nothing to install

  1. Any agent that can run shell commands uses the CLI through npm

    npm exec --yes --package=material-shape-studio-mcp@0.1.3 -- shape-studio list --filter Heart

  2. Hosts with stdio MCP can register this command as a server

    npx --yes material-shape-studio-mcp@0.1.3

The CLI has list, create, preview and export commands; the package's npm README documents their options.

3 Check it works

This prints the Heart shape as JSON. Then ask your agent for a shape, for example “a soft, playful badge shape”.

npm exec --yes --package=material-shape-studio-mcp@0.1.3 -- shape-studio list --filter Heart

Package material-shape-studio-mcp@0.1.3 · Source on GitHub

Agents: plain-text instructions are at agent.txt.