Japan Ux
What it does
Japanese UI + UX correctness for AI coding agents — typography, forms, keigo, JLReq checks.
- Connects 내 컴퓨터에서 실행
- Account or key No key needed
- Category 개발자 도구
설치
쓰고 있는 AI 앱을 고른 다음 설정을 복사하세요.
검사 3/3 통과 · 내 컴퓨터에서 실행돼요
먼저: 어떤 AI를 쓰시나요?
쓰는 앱을 고르면 아래에 단계가 나옵니다.
Claude에 연결할 수 있지만 먼저 준비가 필요해요
먼저 컴퓨터에 Node.js를 설치하세요 (한 번만) · 컴퓨터용 Claude 앱(Windows 또는 Mac)에서만 되고 웹이나 모바일은 안 돼요
컴퓨터용 Claude 앱 설정 파일 열기
SettingsDeveloperEdit Config
이 설정을 붙여 넣고 저장
{ "mcpServers": { "japan-ux": { "command": "npx", "args": [ "-y", "japan-ux-mcp" ] } } }Claude를 끄고 다시 열기
해 보기
Japan Ux을 써서 나에게 무엇을 해 줄 수 있는지 알려 주고, 하나 해 봐✓ Claude가 Japan Ux을 쓰고 있다고 하거나 답에 Japan Ux 도구 이름이 나오면 연결된 거예요
메뉴 이름은 2026년 11월 11일에 Anthropic 도움말에서 확인 · 앱 버전에 따라 화면이 조금 다를 수 있어요
ChatGPT는 아직 Japan Ux에 연결할 수 없어요
Japan Ux는 내 컴퓨터에 설치해서 쓰지만 ChatGPT는 웹에서 도는 서버만 연결할 수 있어요
대신 이렇게 할 수 있어요
A · Japan Ux에 연결되는 앱 쓰기
- 먼저 컴퓨터에 Node.js를 설치하세요 (한 번만) · 컴퓨터용 Claude 앱(Windows 또는 Mac)에서만 되고 웹이나 모바일은 안 돼요
- 먼저 컴퓨터에 Node.js를 설치하세요 (한 번만)
- 먼저 컴퓨터에 Node.js를 설치하세요 (한 번만)
- 먼저 컴퓨터에 Node.js를 설치하세요 (한 번만)
B · 개발자 도구에서 ChatGPT에 연결되는 다른 서버
같은 분류에서 많이 쓰는 것 중 키 없이 주소만으로 연결되는 것을 골랐어요
- Sentry✓ ChatGPT
- Compiler Explorer✓ ChatGPT
- GitDiagram✓ ChatGPT
Claude Code에 연결할 수 있지만 먼저 준비가 필요해요
먼저 컴퓨터에 Node.js를 설치하세요 (한 번만)
터미널 열기
Mac: Command+스페이스를 누르고 Terminal 입력 · Windows: PowerShell 열기
이 명령을 붙여 넣고 Enter
claude mcp add --scope user japan-ux -- npx -y japan-ux-mcpClaude Code에서 /mcp 입력
Japan Ux이 목록에 있고 연결됨으로 보이면 돼요
해 보기
Japan Ux을 써서 나에게 무엇을 해 줄 수 있는지 알려 주고, 하나 해 봐✓ Claude Code가 Japan Ux을 쓰고 있다고 하거나 답에 Japan Ux 도구 이름이 나오면 연결된 거예요
메뉴 이름은 2026년 11월 11일에 Anthropic 도움말에서 확인 · 앱 버전에 따라 화면이 조금 다를 수 있어요
Cursor에 연결할 수 있지만 먼저 준비가 필요해요
먼저 컴퓨터에 Node.js를 설치하세요 (한 번만)
Cursor에서 AI 채팅을 Agent 모드로 열기
해 보기
Japan Ux을 써서 나에게 무엇을 해 줄 수 있는지 알려 주고, 하나 해 봐✓ Cursor가 Japan Ux을 쓰고 있다고 하거나 답에 Japan Ux 도구 이름이 나오면 연결된 거예요
메뉴 이름은 2026년 11월 11일에 Cursor 도움말에서 확인 · 앱 버전에 따라 화면이 조금 다를 수 있어요
VS Code에 연결할 수 있지만 먼저 준비가 필요해요
먼저 컴퓨터에 Node.js를 설치하세요 (한 번만)
VS Code에서 AI 채팅을 Agent 모드로 열기
해 보기
Japan Ux을 써서 나에게 무엇을 해 줄 수 있는지 알려 주고, 하나 해 봐✓ VS Code가 Japan Ux을 쓰고 있다고 하거나 답에 Japan Ux 도구 이름이 나오면 연결된 거예요
메뉴 이름은 2026년 11월 11일에 VS Code 도움말에서 확인 · 앱 버전에 따라 화면이 조금 다를 수 있어요
개발자용: 터미널 명령과 JSON 설정
컴퓨터에 설치
Claude Code
claude mcp add --scope user japan-ux -- npx -y japan-ux-mcpClaude Desktop (claude_desktop_config.json)
{
"mcpServers": {
"japan-ux": {
"command": "npx",
"args": [
"-y",
"japan-ux-mcp"
]
}
}
}Cursor (~/.cursor/mcp.json)
{
"mcpServers": {
"japan-ux": {
"command": "npx",
"args": [
"-y",
"japan-ux-mcp"
]
}
}
}VS Code (mcp.json)
{
"servers": {
"japan-ux": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"japan-ux-mcp"
]
}
}
}이 설정은 제작자의 레지스트리 정보로 만들었어요. README와 다르면 README를 따르세요.
한눈에 보기
어떤 앱에서 쓸 수 있나요
이 서버의 연결 방식과 각 앱의 공식 문서를 바탕으로 했어요. 2026년 11월 10일 확인.
내 컴퓨터에서 실행하는 앱
ClaudeGooseLM StudioMsty StudioCherry StudioCursorVS Code + GitHub CopilotVisual StudioWindsurf (Devin Desktop)ZedKiroClineContinueJetBrains AI AssistantClaude CodeCodex CLIGemini CLIOpenCodenodecodeWarpLibreChatRaycast
할 수 있는 일
내 컴퓨터에서 실행돼요. 설치하면 AI 앱에 도구 목록이 나타나요.
기본 점검i
누구나 볼 수 있는 정보를 점검했고, 코드는 읽지 않았어요. 해당하지 않는 항목은 개수에서 뺐어요. · 2026년 11월 12일 점검
- ✓ 통과
제작자와 저장소 일치
레지스트리 이름이 GitHub 계정 mrslbt 기준으로 확인되었고, 이 계정이 저장소를 소유하고 있어요
- ✓ 통과
계속 관리되고 있음
코드 마지막 변경: 3개월 전
- ✓ 통과
라이선스 있음
MIT 사용
- – 해당 없음
엔드포인트 응답
내 컴퓨터에서 실행되는 서버라 인터넷 엔드포인트가 없어요
- – 해당 없음
OAuth로 로그인
내 컴퓨터에서 실행되며, 대신 로컬 설정을 사용해요
- … 아직 점검 안 함
도구 설명에 숨겨진 지시 없음
내 컴퓨터에서 실행돼요. 도구 목록은 인터넷 엔드포인트가 있는 서버에서만 읽을 수 있어요
토론
질문하고, 팁을 나누고, 안 되는 점을 알려 주세요. "도움이 됨"이 많은 순서예요.
사용자 리뷰
아직 리뷰가 없어요
개발자 도구 카테고리의 다른 서버와 비교i
- 이 카테고리의 다른 서버 5808개 중 0%보다 스타가 많아요
- 이 카테고리의 다른 서버 5808개 중 28%보다 최근에 레지스트리에 공개됐어요
- 기본 점검 결과가 이 카테고리의 다른 서버 5808개 중 100%와 같거나 더 좋아요
레지스트리에서 이 카테고리의 활성 서버 전체와 비교했어요. 스타는 게시자가 저장소를 소유한 경우에만 세요.
자주 묻는 질문
Japan Ux, 안전한가요?
해당하는 기본 점검 3개 중 3개를 통과했어요. 코드는 읽지 않았어요. 키나 토큰을 넣기 전에 서버가 어떤 권한을 요구하는지 확인하고, 꼭 필요한 권한만 있는 키를 쓰세요.
어떤 키나 코드가 필요한가요?
레지스트리에 필수 키가 나와 있지 않아요. 다만 처음 쓸 때 로그인을 요구하는 서버도 있어요.
내 컴퓨터에서 실행되나요, 클라우드에서 실행되나요?
내 컴퓨터에서 실행돼요. AI 앱이 필요할 때 실행하고, 데이터는 제작자의 서버를 거치지 않아요(서버 자체가 온라인 서비스를 호출하는 경우는 제외).
아직 관리되고 있나요?
GitHub 저장소는 마지막으로 3개월 전 변경됐고, 최신 버전(2.1.1)은 3개월 전 레지스트리에 올라왔어요.
어떤 앱에서 쓸 수 있나요?
Claude Desktop, Claude Code, Cursor, VS Code처럼 MCP를 지원하는 앱에서 쓸 수 있어요. 내 컴퓨터에 Node.js도 있어야 해요.
대신 쓸 수 있는 건 뭐가 있나요?
같은 카테고리에는: REA, GitHub, Serena MCP: the IDE for your agent
같은 카테고리의 다른 것
같은 카테고리에서 다른 제작자가 만든 서버예요. 스타 순으로 정렬했어요.
카드 보는 법:↓ 주간 다운로드i★ GitHub 스타i세 기둥: 리뷰 · 점검 · 사용 정도i업데이트 = 최신 버전을 레지스트리에 공개한 날i
GitHub
Connect AI assistants to GitHub - manage repos, issues, PRs, and workflows through natural language.
Serena MCP: the IDE for your agent
A powerful toolkit for coding, providing semantic retrieval and editing capabilities.
제작자의 README
README 열기
제작자의 저장소에서 쓰인 그대로 가져왔어요. PopNx MCP가 검토하거나 보증한 내용이 아니에요. HTML, 이미지, 스크립트는 제거했어요. 링크를 누르면 이 사이트를 벗어나요.
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.
Claude Code — ~/.claude/.mcp.json
{
"mcpServers": { "japan-ux": { "command": "npx", "args": ["-y", "japan-ux-mcp"] } } }
Cursor — ~/.cursor/mcp.json
{
"mcpServers": { "japan-ux": { "command": "npx", "args": ["-y", "japan-ux-mcp"] } } }
Windsurf — ~/.codeium/windsurf/mcp_config.json
{
"mcpServers": { "japan-ux": { "command": "npx", "args": ["-y", "japan-ux-mcp"] } } }
VS Code (GitHub Copilot) — .vscode/mcp.json
{
"servers": { "japan-ux": { "type": "stdio", "command": "npx", "args": ["-y", "japan-ux-mcp"] } } }
Cline (VS Code extension)
Open Cline's MCP settings panel and add:
{
"mcpServers": { "japan-ux": { "command": "npx", "args": ["-y", "japan-ux-mcp"] } } }
Claude Desktop — claude_desktop_config.json
{
"mcpServers": { "japan-ux": { "command": "npx", "args": ["-y", "japan-ux-mcp"] } } }
Config path:
- macOS:
~/Library/Application Support/Claude/claude_desktop_config.json - Windows:
%APPDATA%\Claude\claude_desktop_config.json
Zed — ~/.config/zed/settings.json
{
"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
| Tool | Description |
|---|---|
review_jp_ui | Flagship enforcer — scores CSS/markup against the Japanese UI standard (typography, colour, font payload) with JLReq/JIS citations and fixes. |
generate_jp_form | Outputs Japanese form markup: 姓/名 order, furigana, 〒 postal auto-fill, 3-field phone, 年月日 dates. |
validate_jp_form | Scores a form against JP conventions (0-100) with issues, severity, and code fixes. |
generate_jp_placeholder | Returns test data: names in kanji/katakana/romaji, real postal codes, formatted phone numbers, era dates. |
suggest_keigo_level | Converts English UI text to Japanese at the appropriate politeness level for a given business context. |
score_japan_readiness | Rates a page across five categories: forms, copy, trust signals, typography, cultural fit. |
transform_for_japan | Rewrites Western markup into Japan-ready markup with a before/after score and per-change explanations. |
check_jp_typography | Audits CSS for Japanese typography: font stacks, line-height, kinsoku shori, sizing, palt. |
get_seasonal_context | Returns the current season, active events, 24 microseasons (二十四節気), and launch blackout windows. |
audit_japan_ux | Seven-category audit (layout, typography, visual, navigation, trust, content, mobile) with a letter grade. |
design_direction_for_japan | Produces a Japan-specific design brief from brand type, audience, and industry. |
Prompts
| Prompt | Description |
|---|---|
japan_form | Walks through building a Japanese form. |
japan_audit | Audits pasted markup for JP UX issues. |
japan_transform | Transforms Western markup with before/after scoring. |
japan_testdata | Generates Japanese test data for prototypes. |
japan_keigo | Returns UI text at the appropriate politeness level. |
japan_score | Scores a page description for Japan-readiness. |
japan_typography | Checks CSS for Japanese typography issues. |
japan_seasonal | Returns seasonal design context for a specific month. |
japan_full_audit | Runs a full seven-category Japanese UX audit. |
japan_design_direction | Generates a Japan-specific visual direction. |
Resources
| Resource | Content |
|---|---|
keigo-guide | Four politeness levels across eight business contexts, 30+ UI copy patterns. |
form-checklist | Japanese form conventions for pre-ship review. |
phone-formats | Mobile, landline, toll-free, IP phone patterns with field-split rules. |
era-calendar | 令和 through 明治 with date ranges and conversion formulas. |
typography-guide | Font stacks, type scale, line-height, kinsoku shori, CSS suggestions. |
seasonal-calendar | 24 events, 24 microseasons, seasonal palettes, launch blackout dates. |
trust-checklist | Trust signals, legal pages, and social proof by site type. |
color-guide | Japanese color meanings, the red-name taboo, visual design rules. |
layout-guide | Grid, spacing, density, responsive breakpoints, structural patterns. |
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:
Submit
Transform this form for the Japanese market (fintech context):
First Name Last Name Phone Address Submit
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.
| Data | Count | Details |
|---|---|---|
| Prefectures | 47 | Code, name, kana, romaji, region |
| Names | 100 | 50 surnames + 50 given names in kanji/kana/romaji |
| Addresses | 12 | Real postal codes across major cities |
| Phone formats | 6 | Mobile, landline, toll-free, IP, Navi Dial |
| Eras | 5 | 令和 through 明治 with start/end dates |
| Keigo patterns | 30 | UI strings at 4 politeness levels across 9 element types |
| Width rules | 6 | Full-width/half-width validation per field type |
| Layout rules | 28 | Grid, spacing, density, responsive, structural patterns |
| Typography rules | 24 | Font stacks, sizing, line-height, wrapping, rendering |
| Font stacks | 7 | System, web, serif, mixed modern/elegant/rounded/corporate |
| Visual rules | 21 | Color meanings, imagery, icons, shadows, corners |
| Navigation rules | 16 | Header, footer, menu, search, breadcrumb, pagination |
| Trust signals | 20 | Company info, social proof, certifications, contact |
| Legal requirements | 10 | 特定商取引法, APPI, 景品表示法, 薬機法, and more |
| Seasonal events | 25 | Full year with design impact and business notes |
| Microseasons | 24 | 二十四節気 with approximate dates |
| Color meanings | 9 | Japanese-specific color associations with hex values |
| Platform patterns | 30+ | LINE, QR codes, mobile payments, IME handling, social sharing |
| Accessibility rules | 20+ | JIS X 8341-3, aging population, screen readers, furigana |
| Content patterns | 15+ | Density, copy, product pages, localization rules |
Conventions covered
Forms and input
| Convention | Practice |
|---|---|
| Name order | Family name (姓) first, given name (名) second |
| Furigana | Katakana reading fields (セイ/メイ) below each name input |
| Phone | Three separate fields. Pattern: XXX-XXXX-XXXX |
| Address | 〒 postal code auto-fills prefecture + city. Large-to-small order |
| Dates | Separate 年/月/日 inputs with optional era display (令和6年 = 2024) |
| Character width | Auto-convert full-width digits and symbols to half-width on input |
| Confirmation | 確認画面 review screen before final submission |
Typography
| Convention | Practice |
|---|---|
| No italics | Japanese has no italic form. Use bold, color, or size for emphasis |
| Line-height 1.8+ | Kanji density requires more vertical space than Latin text |
| 16px body minimum | Kanji readability breaks below 14px |
| Kinsoku shori | word-break: keep-all + line-break: strict. Never start a line with punctuation |
| Font stacks | Hiragino Sans, Yu Gothic, Meiryo cascade. Noto Sans JP for web fonts |
| Mixed EN/JP | English font first, Japanese fallback: "Inter", "Noto Sans JP", sans-serif |
Layout and structure
| Convention | Practice |
|---|---|
| Information density | Dense layouts are trusted. Sparse reads as hiding information |
| 1280px PC / 375px mobile | Standard artboard sizes with 140-160px side margins |
| Section spacing | 100px between major sections (PC), 60px on mobile |
| Alternating zigzag | Image-left/text-right, then reverse. Standard on Japanese LPs |
| Breadcrumbs | Required on all interior pages |
| Repeat CTAs | Place conversion buttons at multiple scroll points |
Trust and legal
| Convention | Practice |
|---|---|
| 特定商取引法 | Required legal disclosure for ecommerce. Seller info, returns, payment |
| 会社概要 | Company profile page with address, CEO name, capital, founding year |
| Phone in header | Visible phone number signals legitimacy. 0120 toll-free preferred |
| Privacy policy | 個人情報保護方針 required by APPI (amended April 2022) |
| Proof numbers | Specific metrics near hero: 1,247社導入, 業務効率30%改善 |
| Keigo | Four politeness levels mapped to eight business contexts |
Visual and color
| Convention | Practice |
|---|---|
| Red = prosperity | Not danger. Used freely as a primary brand color |
| No red names | Red-on-white for names carries a death association. Use dark text |
| Black + white alone | Funeral association. Add an accent color |
| Bright palettes | Dense, colorful layouts are normal. Dark theme adoption lags the West |
| Manga/anime illustration | Used across industries, including banks and government |
Seasonal
| Convention | Practice |
|---|
| 4 seasons, 24 microseasons | Each has distinct color palettes and desig