get_design

Q: What do I do with the DESIGN.md it returns?

Save markdown as DESIGN.md at the project's root: Claude Code, Cursor and other agents read it for every UI change. Then set the theme's colors from its tokens (get_guide with topic styling lists the variables).

Q: Which sections of a DESIGN.md can I ask for?

tokens: the YAML front matter (colors, typography, rounded, spacing, components). Then the file's ## sections by heading: Overview, Colors, Typography, Layout, Components, Do's and Don'ts… sections in the answer lists them.

Get a brand's DESIGN.md for the project root: colors, type, spacing, and components. Pass sections when you only want the tokens.

Group: Design
Inputs: namesections?
Access: Read-only

When to use it

After search_designs, to bring a brand's look into the project.
Just the tokens (sections: ["tokens"]), to set the theme's colors and type.

Inputs

InputType

namestring

Its slug, from search_designs: stripe.

sections?string[]

tokens (the YAML: colors, type, spacing, components), Colors, Components, Do's and Don'ts… All when unset.

Example prompts

Name the server, so the agent doesn't answer from memory:

Prompts

use shadcnio to make this app look like Linear

use shadcnio to add Vercel's DESIGN.md to this project

Call and response

Asked “Make this app look like Linear”, the agent sends this call. The response is real, trimmed: long lists show their first items and long strings are cut.

Call

get_design({ name: "linear", sections: ["tokens"] })

Response

{
  "categories": [
    "Project Management",
    "Productivity & SaaS"
  ],
  "description": "A near-black product-focused marketing canvas built around \"#010102\" (the deepest dark surface of any tool in this collection), light gray t…",
  "download": "https://kit.dev/design/linear/raw",
  "file": "DESIGN.md",
  "name": "Linear",
  "sections": [
    "tokens",
    "Overview",
    "… 1 more"
  ],
  "slug": "linear",
  "url": "https://kit.dev/design/linear",
  "website": "https://linear.app",
  "found": 1,
  "markdown": "---\nversion: alpha\nname: Linear\nwebsite: \"https://linear.app\"\ndescription: \"A near-black product-focused marketing canvas built around \\\"#01…",
  "next": "Save markdown as DESIGN.md at the project's root: it's what the UI follows. To theme the components with its colors, get_guide({ topic: \"sty…"
}

Call it by hand

Your MCP client sends this for you. To try the tool without one, post the call yourself; the server answers in server-sent events, the result on the data: line.

Terminal

Google GitHub

Use email insteadPart of Pro

What your agent reads

The server's description of get_design, one of the Design tools. Your agent reads it to decide when to call the tool:

tools/listget_design.description

A brand's DESIGN.md to save at the project's root: tokens (colors, type, spacing, components as YAML), then how to use them. sections for only some.

FAQ

What do I do with the DESIGN.md it returns?

Save markdown as DESIGN.md at the project's root: Claude Code, Cursor and other agents read it for every UI change. Then set the theme's colors from its tokens (get_guide with topic styling lists the variables).

Which sections of a DESIGN.md can I ask for?

tokens: the YAML front matter (colors, typography, rounded, spacing, components). Then the file's ## sections by heading: Overview, Colors, Typography, Layout, Components, Do's and Don'ts… sections in the answer lists them.

Is it the brand's official design system?

An inspired interpretation, written from the brand's public site: its look, not its assets. Use it as a starting point.