screenshot
The rendered page as an image, so Claude can actually judge the design
How to use it
screenshot is exposed by the Claude Design MCP MCP server. Add the server to your MCP client (Claude Desktop, Cursor, Windsurf and others), and the screenshot tool becomes available to the model automatically. See the full listing for setup details and every tool this server provides.
Install Claude Design MCP
claude mcp add claude-design --scope user -- node "$PWD/src/index.mjs"Other tools in Claude Design MCP (22)
Point a project at a connected GitHub repository
Shut the background Chrome and flush its profile
An empty design-system project. Type is fixed at creation, so it cannot be converted later
The "What should we create?" box: a prompt, an optional template, and it starts building
Delete one chat thread and its transcript
Delete files from a project, verifying they are gone
Delete a project or design system. Requires confirmName to match its exact current name
Attach design systems to a project so its chats design against them
Attach a local folder as the project's codebase, so it designs against your real code
Chat threads in a project, marking the active one
Recursive file listing
Every project, with its projectId and whether it is a design system
The home-screen tiles: Blank, Mobile app design, Slides, Wireframe, Diagram and 9 more
Put the window on your display, on a given project, chat and page
Download files to a local directory, binaries included
Tail of a transcript. How you read what Claude Design said
Read a file, or a line range of one, without downloading it
Grep the project's files, with line numbers and context
Send an instruction, wait for the answer, return the reply and what changed. Takes local attachments
Make a different thread active, since sendprompt posts into the active one
Push a Figma .fig file in from disk
Push files up, e.g. components into a design system