japan-ux-mcp

Japan Design — UI + UX correctness for AI coding agents. A front-end enforcer: point it at real CSS/markup and it scores your UI against the Japanese standard — typography (kinsoku, line-height, fonts), colour symbolism, font performance — with W3C JLReq / JIS X 4051 citations and fixes. Plus the full UX layer: forms (姓名/furigana), keigo, trust signals, legal, and seasonal design.

Lead tool: review_jp_ui — the front-end correctness enforcer (run it on any UI, including Western-built, before shipping to Japan).

Eleven tools, ten prompts, nine resources. Runs locally, no API keys. Findings are labelled spec (JLReq/JIS) vs convention (documented JP web practice) so authority is never overstated.

Install

claude mcp add japan-ux -- npx -y japan-ux-mcp

JSON config

The server config is the same across clients; only the file path differs.

{
  "mcpServers": {
    "japan-ux": { "command": "npx", "args": ["-y", "japan-ux-mcp"] }
  }
}

{
  "mcpServers": {
    "japan-ux": { "command": "npx", "args": ["-y", "japan-ux-mcp"] }
  }
}

{
  "mcpServers": {
    "japan-ux": { "command": "npx", "args": ["-y", "japan-ux-mcp"] }
  }
}

{
  "servers": {
    "japan-ux": { "type": "stdio", "command": "npx", "args": ["-y", "japan-ux-mcp"] }
  }
}

{
  "mcpServers": {
    "japan-ux": { "command": "npx", "args": ["-y", "japan-ux-mcp"] }
  }
}

{
  "mcpServers": {
    "japan-ux": { "command": "npx", "args": ["-y", "japan-ux-mcp"] }
  }
}

{
  "context_servers": {
    "japan-ux": { "command": { "path": "npx", "args": ["-y", "japan-ux-mcp"] } }
  }
}

From source

git clone https://github.com/mrslbt/japan-ux-mcp.git
cd japan-ux-mcp
npm install && npm run build

Point the client config at the built entry:

{ "command": "node", "args": ["/absolute/path/to/japan-ux-mcp/dist/index.js"] }

Tools

Prompts

Resources

Example prompts

Build a registration form for a Japanese B2B SaaS product. Include name,
email, phone, company, and address. Use TSX with Tailwind.

Audit this form for Japanese conventions:
<form>
  <input name="firstName" placeholder="First Name" />
  <input name="lastName" placeholder="Last Name" />
  <input name="email" />
  <input name="phone" />
  <button>Submit</button>
</form>

Transform this form for the Japanese market (fintech context):
<form>
  <label>First Name <input name="firstName" /></label>
  <label>Last Name <input name="lastName" /></label>
  <label>Phone <input name="phone" /></label>
  <label>Address <input name="address" /></label>
  <button type="submit">Submit</button>
</form>

I need Japanese UI copy for a banking app:
- Error: "Invalid email address"
- Button: "Submit application"
- Empty state: "No transactions yet"
- Confirmation: "Are you sure you want to delete?"

Check this CSS for Japanese typography issues:
body { font-family: Arial; font-size: 14px; line-height: 1.4; font-style: italic; }

Run a Japanese UX audit on this B2B SaaS landing page. Hero with English
tagline, feature grid, pricing table, no phone number in header, no
company info page, single-column layout.

Bundled data

All data ships with the package. No external APIs, no keys, no network calls.

Conventions covered

Forms and input

Typography

Layout and structure

Trust and legal

Visual and color

Seasonal

Client support

日本語

日本のWeb UX慣習のためのMCPサーバーです。姓名順、フリガナ、3分割電話番号、〒住所フロー、敬語レベル、タイポグラフィ、信頼シグナル、特定商取引法などの法要件、季節デザインをツール・プロンプト・リソースとして提供します。

Claude Code、Cursor、Windsurf など MCP 対応クライアントで動作します。ローカル動作、APIキー不要。

Disclaimer

This server returns guidance, style rules, and cultural context for building Japanese-facing products. It does not call any brand's API or act on a brand's behalf. Company and service names that appear in examples or recommendations (banks, mobile carriers, payment services, delivery companies, etc.) are referenced as cultural context for users in Japan, not as endorsements or affiliations. All trademarks belong to their respective owners.

License

MIT

More MCPs

Built by Marsel Bait in Tokyo