MCP Server Documentation

Bring 168 research-backed UX principles directly into your Claude conversations. Works with Claude Code and Claude Desktop.

NPM Package@uxuiprinciples/mcp-server

What is MCP?

Model Context Protocol (MCP) is an open protocol that allows AI assistants like Claude to access external tools and data sources. Our MCP Server gives Claude direct access to the UX/UI Principles library.

Ask Claude about specific UX principles while coding
Get UX smell detection for your designs
Access flow checklists during code reviews
Search 168 principles with natural language

Setup

Claude Code (CLI)

Add to your claude_desktop_config.json or project settings:

claude_desktop_config.json

{
  "mcpServers": {
    "uxui-principles": {
      "command": "npx",
      "args": ["-y", "@uxuiprinciples/mcp-server"],
      "env": {
        "UXUI_API_KEY": "uxui_live_your_key_here"
      }
    }
  }
}

Claude Desktop

Add to your Claude Desktop configuration file:

macOS: ~/Library/Application Support/Claude/claude_desktop_config.json

Windows: %APPDATA%\Claude\claude_desktop_config.json

claude_desktop_config.json

{
  "mcpServers": {
    "uxui-principles": {
      "command": "npx",
      "args": ["-y", "@uxuiprinciples/mcp-server"],
      "env": {
        "UXUI_API_KEY": "uxui_live_your_key_here"
      }
    }
  }
}

After adding the configuration, restart Claude to load the MCP server.

Available Tools

The MCP Server provides these tools to Claude:

TOOLsearch_principles

Search UX/UI principles by keyword, part, or difficulty level.

paramsquery, part?, difficulty?, locale?

TOOLget_principle

Get detailed information about a specific principle by slug or code.

paramsidentifier, locale?

TOOLget_ux_smells

Retrieve UX anti-patterns to check against your designs.

paramscategory?, search?, locale?

TOOLget_flow_checklist

Get pre-flight and post-flight checklists for user flows.

paramsflow_slug?, locale?

TOOLget_ai_prompts

Get AI prompts for validating specific design patterns.

paramsprinciple_code?, locale?

Usage Examples

Here's how to use UX principles in your Claude conversations:

Validate a form design

"I'm building a checkout form. What UX principles should I consider for form design?"

Check for UX smells

"Check my navigation design for UX smells related to cognitive load."

Get a checklist

"Give me the pre-flight checklist for an onboarding flow."

Search by topic

"Find all principles related to accessibility and color contrast."

Troubleshooting

MCP Server not loading

Verify your API key is correct
Check that npx is available in your PATH
Restart Claude Code or Claude Desktop
Check the Claude logs for error messages

Authentication errors

Ensure your API key starts with "uxui_live_"
Check that your subscription is active
Try regenerating your API key in the dashboard

Slow responses

The first request may be slower as the package initializes
Subsequent requests should be faster
Check your internet connection

Also Available

REST API

Need programmatic access? Use our REST API to integrate UX principles into your applications, CI/CD pipelines, or custom tools.

View API Documentation

Ready to get started?

Get your API key and start using UX principles in Claude.

Get MCP Access

$19/year • Or get the Developer Bundle with REST API for $29/year

{ "mcpServers": { "uxui-principles": { "command": "npx", "args": ["-y", "@uxuiprinciples/mcp-server"], "env": { "UXUI_API_KEY": "uxui_live_your_key_here" } } } }