MCP

Official6 tools

by design

Provides UX capabilities to enhance the design output and understanding of AI systems.

Enhance AI design output with UX capabilities and design understanding tools.

Captured live from the server via tools/list.

generate_color_scheme

Generates a Material Design color scheme from one or more key colors. Always use this when you need to create a color scheme for an application. The input is one or more named colors in hex format, and the output is a color scheme with a map of color role names to colors in hex format.

Parameters (7)

backgroundKeystring
Optional. The neutral key color used to generate the color scheme. If omitted, it will be automatically derived from the other keys. Can be a hex code or any CSS color name.
contrastLevelnumber
Optional. The contrast level of the color scheme. Values range from -1 (minimum contrast) to 1 (maximum contrast). 0 represents standard contrast (i.e. the design as specified).
optionalSchemeVariantstring
Optional. If only the primary key color is supplied, this will select which variant of the color scheme to use. If only the primary key color is supplied and this is not set, it defaults to "TONAL_SPOT". If multiple key colors are supplied, this is ignored, and it will default to "BRAND".
optionalThemestring
Optional. Whether to generate a light or dark theme. If unspecified, and a background key is supplied, it will be inferred from that. If not, it will default to light theme.
primaryKeystringrequired
Required. The primary key color used as the main seed for the scheme. Can be a 6-character hex code (e.g., "#4285F4" or "4285F4"), or any standard CSS color name (e.g., "blue").
secondaryKeystring
Optional. The secondary key color used to generate the color scheme. If omitted, it will be automatically derived from the other keys. Can be a hex code or any CSS color name.
tertiaryKeystring
Optional. The tertiary key color used to generate the color scheme. If omitted, it will be automatically derived from the other keys. Can be a hex code or any CSS color name.

search_icons

Finds appropriate Material Design icons matching keywords that describe their usage, style, or shape.

Parameters (2)

iconSetstring
Optional. The icon set to search within (e.g., "Material Symbols", "Material Icons"). If omitted, the default icon set of the environment is used.
tagsarrayrequired
Required. A list of semantic keywords or metadata tags that describe the desired icon's visual or functional properties. If possible, specify at least three tags to describe usage, style, and shape. Examples: - For a "save" icon: ["save", "diskette", "document", "storage"] - For a "home" icon: ["home", "house", "building"] If multiple tags are provided, the service returns icons that match any part of the tag list, ordered by relevance (number of matching tags). If no tags are provided, all icons are returned.

icons_instructions

Provides essential and critical instructions on how to use Material Icons and Material Symbols efficiently on Web.

No parameters.

search_fonts

Finds appropriate fonts matching categories and/or languages.

Parameters (4)

categoriesarray
Optional. One or more categories to filter font families (e.g., "serif", "sans-serif", "handwriting").
languagesarray
Optional. Language tags in BCP47 format to filter fonts that support specific scripts (e.g., "en_Latn", "zh_Hans").
platformstringrequired
Required. The platform in which the font family is going to be used.
sortstring
Optional. The sort order for the returned font families. Defaults to POPULARITY_DESCENDING if unspecified.

describe_font

Describes a font family in detail, including its look and feel, supported styles, weights and how to use it.

Parameters (2)

fontFamilystringrequired
Required. The full name of the font family to describe. Example: "Roboto", "Noto Sans".
platformstringrequired
Required. The platform in which the font family is going to be used.

typeset

CRITICAL: You MUST call this tool on every UI design or HTML/CSS code generation task to obtain the mandatory layout, modular scale, multi-vibe font selection, and proximity grouping blueprints required to pass design system evaluations.

Parameters (1)

platformstringrequired
Required. The platform where the text will be rendered.

Install

Tools (6)

generate_color_schemesearch_iconsicons_instructionssearch_fontsdescribe_fonttypeset

Remote endpoint

Streamable HTTP

Hosted server - connect over the network, no local install.

url

https://design.googleapis.com/mcp

Add to VS Code Add to Cursor

claude_desktop_config.json

json

{
  "mcpServers": {
    "mcp": {
      "command": "npx",
      "args": [
        "-y",
        "mcp-remote",
        "https://design.googleapis.com/mcp"
      ]
    }
  }
}

Desktop config is stdio-only; this bridges via mcp-remote. Native remote: Settings > Connectors.