ต้นแบบ · รุ่นทดลอง: มีทุก server ในทะเบียนทางการ อัปเดตทุก 30 นาที รีวิวและบัญชีผู้ใช้จะมาในขั้นถัดไป
PopNx MCPที่รวม MCP สำหรับคนใช้ AI · อธิบายเป็นภาษาคน

Raven

โดย rhinocapรุ่น 3.0.0i★ –iบนเครื่องหรือคลาวด์
ชื่อใน registryai.ravenmcp/raven-mcp

ติดตั้ง

ภาพรวม

คำอธิบายจากผู้ทำ (ภาษาอังกฤษตามต้นฉบับ)

Design intelligence for coding agents: audits, design systems, and a taste profile agents consult.

สามเสาของ PopNx MCP

สามเรื่องนี้ไม่รวมเป็นคะแนนเดียว เพราะความเห็น การวัด และความนิยม เป็นคนละเรื่องกัน

ใช้ทำอะไรได้

ตัวนี้ยังไม่ได้เรียบเรียงเป็นภาษาไทย ด้านล่างคือข้อเท็จจริงที่เราอ่านจาก registry

  • การเชื่อมต่อ: บนเครื่องหรือคลาวด์
  • ช่องทาง (transport): stdio, Streamable HTTP
  • หมวด: เครื่องมือนักพัฒนา

ติดตั้ง

เลือกโปรแกรม AI ที่คุณใช้ แล้วคัดลอกค่าตั้งไปวาง

ก่อนติดตั้ง

ต้องเตรียมก่อน

  • รันบนคลาวด์ไม่ต้องลงโปรแกรมเพิ่ม ต่อผ่านอินเทอร์เน็ตได้เลย
  • npmติดตั้ง Node.js (มีคำสั่ง npx) ในเครื่อง

คุณใช้แอปไหน

เลือกแอปด้านบน เราจำไว้ให้ ครั้งหน้าปุ่มจะขึ้นว่า “ติดตั้งลง …”

ใช้ได้ทั้ง Claude บนเว็บ แอปคอมพิวเตอร์ และมือถือ:

  1. เปิด Settings → Connectors
  2. กด Add custom connector
  3. วางที่อยู่ด้านล่างแล้วกด Add
  4. ถ้าให้ล็อกอิน ให้ล็อกอินกับผู้ทำ
SettingsConnectors1+ Add2https://…3
https://mcp.ravenmcp.ai/api/mcp

หรือรันในเครื่องคุณ

เปิด Claude Desktop → Settings → Developer → Edit Config แล้ววางค่านี้ในไฟล์ claude_desktop_config.json

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

พิมพ์คำสั่งนี้ใน Terminal

claude mcp add --transport http raven https://mcp.ravenmcp.ai/api/mcp

หรือรันในเครื่องคุณ

claude mcp add raven -- npx -y raven-mcp

เปิดใน Cursor

หรือคัดลอกค่าตั้งเอง

วางในไฟล์ .cursor/mcp.json ของโปรเจกต์ หรือ ~/.cursor/mcp.json

{
  "mcpServers": {
    "raven": {
      "url": "https://mcp.ravenmcp.ai/api/mcp"
    }
  }
}

หรือรันในเครื่องคุณ

เปิดใน Cursor

หรือคัดลอกค่าตั้งเอง

วางในไฟล์ .cursor/mcp.json ของโปรเจกต์ หรือ ~/.cursor/mcp.json

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

เบราว์เซอร์จะถามก่อนเปิดแอป จากนั้นแอปแสดงค่าตั้งให้ตรวจแล้วกดยืนยัน ช่อง key เว้นว่างไว้ให้คุณใส่เอง

เปิดใน VS Code

หรือคัดลอกค่าตั้งเอง

วางในไฟล์ .vscode/mcp.json ของโปรเจกต์

{
  "servers": {
    "raven": {
      "type": "http",
      "url": "https://mcp.ravenmcp.ai/api/mcp"
    }
  }
}

หรือรันในเครื่องคุณ

เปิดใน VS Code

หรือคัดลอกค่าตั้งเอง

วางในไฟล์ .vscode/mcp.json ของโปรเจกต์

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

เบราว์เซอร์จะถามก่อนเปิดแอป จากนั้นแอปแสดงค่าตั้งให้ตรวจแล้วกดยืนยัน ช่อง key เว้นว่างไว้ให้คุณใส่เอง

ChatGPT ต่อได้เฉพาะ server ที่อยู่บนอินเทอร์เน็ต:

  1. เปิด ChatGPT บนเว็บ → Settings → Connectors (Apps)
  2. กด Create หรือ Add (บางแพ็กเกจต้องเปิด Developer mode ใน Advanced ก่อน)
  3. วางที่อยู่ด้านล่าง ตั้งชื่อ แล้วบันทึก
  4. ถ้าให้ล็อกอิน ให้ล็อกอินกับผู้ทำ
SettingsConnectors1+ Create2https://…3
https://mcp.ravenmcp.ai/api/mcp

ชื่อเมนูอาจต่างกันเล็กน้อยตามแพ็กเกจและรุ่นของแอป

ตัวเลือกเก็บในคุกกี้บนเครื่องนี้ ไม่ต้องมีบัญชี

ค่าตั้งนี้สร้างจากข้อมูลใน registry ของผู้ทำ ถ้าไม่ตรงกับ README ให้เชื่อ README

ทำอะไรได้บ้าง

ชื่อและคำอธิบายเครื่องมือตามที่ server ตอบมาเมื่อ 6 พ.ย. 2569 ผู้ทำเป็นคนเขียน ไม่ใช่เรา แสดงเป็นข้อความล้วน

  • get_principles

    Get design principles relevant to a UI context. Returns usability heuristics, laws of UX, Gestalt principles, accessibility requirements, typography rules, and color theory — matched to what you're designing.

  • get_pattern

    Get proven UI/UX patterns for a specific design type. Returns do's, don'ts, evidence, and checklists for signup flows, pricing pages, navigation, forms, landing pages, dashboards, modals, empty states, error states, loading states, CTAs, social proof, and mobile conversion.

  • get_business_strategy

    Get business and monetization strategies for digital products. Covers monetization models, retention strategies, onboarding optimization, growth mechanics, and product metrics frameworks.

  • evaluate_design

    Evaluate a design description against UX principles. Returns relevant principles, potential violations, and improvement suggestions. Screenshot pixel-diff is disabled on the hosted (remote) endpoint (unbounded image decode). Omit 'before_screenshot'/'after_screenshot' and pass a

  • search_knowledge

    Search across all design principles, UI patterns, and business strategies. Use when you need to find specific guidance or don't know which category to look in.

  • get_checklist

    Get a pre-publish checklist for a specific UI type. Returns actionable yes/no items to verify before shipping.

  • get_d4d_framework

    Get the Design for Delight (D4D) framework templates. Returns customer problem statement, ideal state, hypothesis, LOFA, and experiment templates for structured product thinking.

  • list_design_systems

    Browse available design systems for tokens. Filter by category (component-library, consumer, developer, fintech, framework, platform, productivity) or search by name.

  • get_design_system

    Get design tokens for a specific design system. Returns colors, typography, spacing, radii, elevation, and motion tokens in W3C DTCG, CSS custom properties, or flat format.

  • compose_system

    Mix tokens from different design systems to create a custom composite. Example: Linear's colors + Stripe's typography.

  • audit_page

    Audit HTML/CSS against Raven's design quality standards. Checks typography (min 13px, weight 400+, modular-scale heading ratios, line-height consistency), accessibility (WCAG touch targets, alt text, contrast), responsive patterns (flexbox over grid, clamp sizing, max-width conta

  • score_page

    Score an HTML/CSS page across 7 design categories (Structure, Typography, Color & palette, Spacing & rhythm, Accessibility, Responsive layout, Design tokens), each rated 0–10. Scores are derived deterministically from the same checks as audit_page — no browser required. Pass html

  • audit_parity

    Compare iOS vs Android element snapshots against a checklist of named spatial relationships (vertical centering, baseline/left alignment, equal gap/size, presence, truncation) and flag per-relation match/mismatch/uncertain — catches cross-platform layout drift like status text ce

  • audit_ios_a11y

    Score an accessibility-enriched iOS element snapshot — missing accessibilityLabel/value/traits, sub-44pt tap targets, per-text WCAG contrast, Dynamic Type clipping, and VoiceOver reading order. Provide {elements:[{label,value,hint,traits,role,rect,fontPt,fgColor,bgColor,dynamicTy

  • audit_responsive_visibility

    Render a URL at multiple breakpoints and flag content elements that are visible on desktop but hidden on mobile (display:none / opacity:0 / visibility:hidden / zero-size). Categorises each flag as 'likely-oversight' (content that vanishes on mobile — the hidden-on-mobile content

  • audit_contrast

    Compute WCAG contrast ratios for every text element on a rendered page (pass url) or from a supplied dom_snapshot. Reports AA (4.5:1 normal, 3:1 large) and AAA pass/fail and surfaces failing pairs with selector, ratio, and delta-to-pass — replacing manual eyedropper + ratio math.

  • suggest_contrast_fix

    Given failing WCAG color pairs, return the MINIMAL color change that clears the target ratio. For each {fg,bg} pair, computes the smallest foreground adjustment (and an alternative background adjustment) that reaches AA/AAA — with the achieved ratio and direction. Feeds directly

  • audit_url

    Layer 0 render-and-capture audit: renders a LIVE URL at each viewport×theme, scroll-settles (fires whileInView/IntersectionObserver reveals; plays preload=none videos), optionally fires caller-supplied hover/focus/click interactions, and captures real pixels + the rendered DOM. T

  • audit_content

    Evaluate an array of content items (headings, prose, CTAs, labels, captions, metrics, outcomes) against UX-writing principles and deterministic heuristics. Returns a per-item verdict (pass/warn/fail) with matched principle ids, concrete issues grounded in principle text, a before

  • audit_typography

    Audit the typographic SCALE of a rendered page (pass url) or a pre-collected snapshot of text nodes. Emits a focused report: (a) MODULAR SCALE — detects the dominant ratio (~1.2/1.25/1.333/1.5) across distinct font sizes and flags off-scale outliers; (b) LINE-HEIGHT CONSISTENCY —

  • audit_tap_targets

    WCAG 2.5.5 / Apple 44pt tap-target audit for the web. Collects every interactive element (a, button, [role=button], input[type=submit/button/checkbox/radio], select, summary, label[for], [onclick], [tabindex>=0]) and emits a PER-ELEMENT fix table for any whose rendered width or h

  • get_brand_system

    Get a complete design system for building an app with branding like a specific company. Say 'Make me an app with branding like Spotify' and get the full token set, style guide, and implementation instructions. Matches against 12 known design systems and provides closest match wit

  • generate_design_system

    Generate a complete, custom design system with full token set. Provide a brand color to auto-generate a harmonious palette, pick a style preset, and export as visual HTML documentation, CSS variables, W3C DTCG JSON, Figma Variables, or SVG palette card. The HTML export is a beaut

  • audit_layout

    Evaluate visual rhythm from a rendered page's geometry. Call with no arguments to get a DevTools snippet to paste into your page — it prints {elements, viewport} JSON. Call again with that JSON to get alignment, gap-rhythm, and optical-balance scores. This is the complement to au

  • audit_swiftui

    Audit SwiftUI source against Apple's Human Interface Guidelines. Flags hardcoded .font(.system(size:)) below ~13pt and tiny semantic fonts (.caption/.caption2), hardcoded Color(red:green:blue:)/hex instead of asset-catalog or semantic system colors, an empty/undefined AccentColor

  • audit_screen

    Audit a rendered mobile screen (iOS or Android) from a view-hierarchy/accessibility snapshot. Call with no arguments for the expected snapshot shape and how to capture it. Pass platform:"android" to score against the 48dp Material touch minimum and Material muted roles (onSurface

  • audit_ios_screen

    Audit a rendered iOS screen from a view-hierarchy/accessibility snapshot (and optional screenshot). Alias of audit_screen with platform:"ios". Call with no arguments for the expected snapshot shape. Call with {elements:[{label,rect:{x,y,w,h},role,fontPt,fgColor,bgColor}],viewport

  • audit_ios_privacy

    Audit an iOS or React Native/Expo app's privacy posture for App Review and user trust. Reads a native Info.plist XML OR an Expo app.json (managed Expo apps have no Info.plist) — plus optional PRIVACY.md, entitlements, and source. Flags: NS*UsageDescription strings that are vague/

  • audit_rn

    Audit React Native / Expo source (JSX/TSX + StyleSheet) against the iOS HIG + Android Material conventions RN must satisfy. Flags touchables missing accessibilityLabel/accessibilityRole, touchables below 44pt without hitSlop, allowFontScaling={false}, fontSize below ~13, screens

  • list_content_systems

    Browse available content design systems — brand voice and tone guides (Conversational Product Voice, GOV.UK, Shopify Polaris, Atlassian). Filter by category or search by name.

  • get_content_system

    Get a brand's content design system — voice attributes, tone shifts by context, vocabulary (use/avoid/never), grammar rules, content patterns for errors/empty-states/buttons/etc., and inclusive language guidance.

  • get_content_principles

    Get UX-writing principles — clarity over cleverness, active voice, error-message anatomy, inclusive language, voice vs tone, and more. Filter by the writing context (e.g. 'error messages', 'notifications', 'form labels').

  • get_content_pattern

    Get content design patterns — copy recipes for error messages, empty-state copy, notifications, and form validation. Returns do's, don'ts, good/bad examples, evidence, and a checklist.

  • get_research_method

    Get research method details — qualitative (interviews, contextual inquiry, diary, field, intercept), quantitative (surveys, analytics, A/B tests, benchmarking, clickstream), or usability (moderated, unmoderated, 5-second, card sort, tree test, heuristic eval). Returns specific pr

  • get_metrics_framework

    Get a product-metrics framework — HEART (Google), AARRR/Pirate (Dave McClure), North Star Metric, Conversion Funnel, RICE Scoring, or OKRs. Returns structure, when-to-use, pitfalls, and examples. Use when the user asks 'how should we measure success?' or 'what metrics should we t

  • get_service_pattern

    Get a service design pattern — service blueprinting, human handoff, signup-as-service, omnichannel continuity, or moments of truth / recovery. Returns patterns, do/don't guidance, evidence, and a checklist. Use when the user is designing a service flow, escalation, cross-channel

  • get_service_standard

    Get the GOV.UK Service Standard — 14 points the UK government uses to assess whether a public service is ready to launch. Widely applicable as a rigorous service-quality checklist beyond government. Use when the user asks how to evaluate a whole service.

  • generate_service_blueprint

    Render a service blueprint as a self-contained HTML page. Supports two modes: (1) classic Shostack single-actor blueprint — user action, frontstage, backstage, support, evidence, pain/delight; (2) two-actor HI-loop blueprint — when `actors` is supplied, renders two swim lanes wit

  • get_brand_principles

    Get brand and visual-design principles — logo usage (clear space, min sizes, variants, placement, restraint), gradient usage (hierarchy, palette, contrast, trend vs signature), imagery (consistency, representation, purpose), visual hierarchy, and brand-as-system thinking. Use whe

  • get_brand_trends

    Get current brand and visual-design trends — what's working in 2026 and where each trend fits or fails. Includes bento grids, monospace type, neon-on-dark-glass, generative patterns, brutalism rebound, AI-generated imagery, lowercase/mixed case. Each trend is time-stamped — treat

  • list_creative_models

    Browse Raven's provider-agnostic creative model catalog. These are capability slots for image, video, 3D, audio, character consistency, and creative analysis. Each entry lists typical inputs and best-for guidance.

  • list_creative_presets

    Browse Raven creative presets for product photoshoots, marketplace cards, UGC ads, TV spots, cinematic reveals, social launch packs, storyboards, and infographics.

  • score_creative

    Score a creative prompt, script, or ad concept for hook strength, benefit clarity, product signal, call-to-action, channel fit, audience fit, and brand fit. This is a transparent heuristic, not a proprietary prediction model. Local brand profiles are not available on the hosted (

  • audit_consistency

    Audit multiple pages for cross-page consistency of content-container width and hero heading tier. Pass ≥2 pages ({name, html}) collected from different routes on the same site. Infers the canonical (modal) value from the corpus when no token is supplied, so you need not know the

  • audit_video_playback

    Render a page in headless Chromium and observe whether each actually advances (samples currentTime before/after a play attempt), classifying every clip into playing|paused|stalled|empty|error with a reason. Catches black/non-playing videos that static audits miss — the most commo

ผลตรวจเบื้องต้นi

เราตรวจจากข้อมูลที่ใครก็เปิดดูได้ ยังไม่ได้อ่านโค้ด ข้อที่ไม่เกี่ยวกับตัวนี้ไม่นับในตัวหาร · ตรวจเมื่อ 8 พ.ย. 2569

  • ✓ ผ่าน

    ตัวตนผู้ทำตรงกับ repo

    ชื่อใน registry ยืนยันโดเมน ravenmcp.ai แล้ว (registry ตรวจความเป็นเจ้าของโดเมน)

  • … ยังไม่ตรวจ

    ยังมีคนดูแล

    ยังไม่ได้อ่านข้อมูล repo จาก GitHub

  • … ยังไม่ตรวจ

    มีสัญญาอนุญาต (license)

    ยังไม่ได้อ่านข้อมูล repo จาก GitHub

  • ✓ ผ่าน

    endpoint ตอบ

    ตอบกลับใน 161 ms (HTTP 200)

  • – ไม่เกี่ยว

    ล็อกอินแบบ OAuth

    ไม่ต้องล็อกอิน

  • ✓ ผ่าน

    คำอธิบายเครื่องมือไม่มีคำสั่งแอบแฝง

    อ่านคำอธิบายเครื่องมือ 45 ตัวแล้ว ไม่พบคำสั่งแอบแฝงถึง AI

เทียบกับตัวอื่นในหมวด เครื่องมือนักพัฒนาi

  • ดาวมากกว่า 0% ของอีก 5549 ตัวในหมวดนี้
  • ส่งรุ่นใหม่เข้า registry ล่าสุดกว่า 79% ของอีก 5549 ตัวในหมวดนี้
  • ผลตรวจเบื้องต้นดีกว่าหรือเท่ากับ 100% ของอีก 5549 ตัวในหมวดนี้

เทียบกับทุก server ที่ยังใช้งานในหมวดนี้ทั้งทะเบียน ดาวนับเฉพาะเมื่อผู้ลงทะเบียนเป็นเจ้าของ repo

คำถามที่พบบ่อย

Raven ปลอดภัยไหม?

จากการตรวจเบื้องต้นของเรา ผ่าน 3 จาก 3 ข้อที่ตรวจได้ เรายังไม่ได้อ่านโค้ด ก่อนใส่กุญแจหรือ token ให้ดูว่า server ขอสิทธิ์อะไร และเลือกกุญแจที่ทำได้เท่าที่จำเป็น

ต้องใช้กุญแจหรือรหัสอะไรบ้าง?

registry ไม่ได้ระบุว่าต้องใช้กุญแจ แต่บางตัวจะขอให้ล็อกอินตอนใช้ครั้งแรก

ตัวนี้รันบนเครื่องหรือบนคลาวด์?

ได้ทั้งสองแบบ จะลงในเครื่องหรือต่อผ่านคลาวด์ก็ได้

ยังมีคนดูแลอยู่ไหม?

repo บน GitHub มีการแก้โค้ดล่าสุด – และส่งรุ่นล่าสุด (3.0.0) เข้า registry 4 วันที่ผ่านมา

ใช้กับโปรแกรมไหนได้บ้าง?

โปรแกรมที่รองรับ MCP เช่น Claude Desktop, Claude Code, Cursor และ VS Code ตัวนี้ต่อผ่าน URL จึงใช้กับโปรแกรมที่รับ remote MCP ได้ เช่น ChatGPT ที่เปิดโหมดนักพัฒนา

มีตัวไหนใช้แทนได้บ้าง?

ในหมวดเดียวกันมี GitHub, Desktop Commander, Cloudflare MCP

ตัวที่ใช้แทนได้

server หมวดเดียวกันจากผู้ทำคนอื่น เรียงตามดาว

อ่านการ์ด:↓ ดาวน์โหลดต่อสัปดาห์i★ ดาว GitHubiสามเสา: รีวิว · ผลตรวจ · การใช้งานiอัปเดต = วันที่ส่งรุ่นล่าสุดเข้า registryi

GitHub

server ทางการของ GitHub ให้ AI อ่านและจัดการโค้ด issue และ pull request ในบัญชีของคุณได้ ใช้ผ่านคลาวด์ของ GitHub หรือรันในเครื่องด้วย Docker ก็ได้

โดย githubใช้กันมาก★ 34.2Kอัปเดต 5 วันที่ผ่านมา

บนเครื่องหรือคลาวด์

Desktop Commander

MCP server for terminal commands, file operations, and process management

โดย wonderwhy-erใช้กันมาก↓ 709.6K/สัปดาห์★ 10.2Kอัปเดต 17 วันที่ผ่านมา

รันบนเครื่อง

Cloudflare MCP

Cloudflare MCP servers

โดย cloudflareใช้กันมาก★ 4.4Kอัปเดต 14 เดือนที่ผ่านมา

รันบนคลาวด์✓ mcp.cloudflare.com

README จากผู้ทำ

เปิดอ่าน README

ส่วนนี้คัดจาก repo ของผู้ทำตามต้นฉบับ PopNx MCP ไม่ได้ตรวจหรือรับรองเนื้อหา ตัด HTML รูปภาพ และสคริปต์ออกแล้ว ลิงก์จะพาออกนอกเว็บ

Raven MCP

Odin's ravens brought back knowledge of the world — Raven brings back design intelligence.

Raven is an MCP server for coding agents. Click any element in the app you have running locally and say what should change — Raven sends the agent the selector, the computed styles, and your design tokens — then audits the result for contrast, tap targets, and typography.

Raven MCP is a personal open-source project by Andrew Cunliffe. It is not endorsed by, affiliated with, or supported by Intuit Inc. or any other company referenced in its source data. See NOTICE for full attribution of upstream sources and their licenses.

What it does

Raven gives Claude access to a comprehensive design knowledge base:

  • Principles — Nielsen's 10 Heuristics, all 21 Laws of UX, Gestalt principles, WCAG accessibility, typography rules, color theory, mobile UX, D4D framework, UX writing, service design, brand, color-systems (palette-size discipline), and spacing-systems (base-unit grid + scale limits)
  • Patterns — Proven UI patterns for signup flows, pricing pages, navigation, dropdown/select menus, forms, landing pages, dashboards, modals, empty/error/loading states, CTAs, social proof, mobile conversion — plus content patterns (error messages, empty-state copy, notifications, form validation) and service patterns (service blueprinting, human handoff, signup-as-service, omnichannel continuity, moments of truth)
  • Content systems — Voice & tone guides: Conversational Product Voice, GOV.UK, Shopify Polaris, and Atlassian
  • Research — Qualitative, quantitative, and usability methods with do/don't protocols and checklists. Metrics frameworks: HEART, AARRR/Pirate, North Star Metric, conversion funnel, RICE, OKRs.
  • Service design — Service blueprinting (with HTML blueprint generation — current vs. ideal state), human-handoff patterns, signup-as-service, omnichannel continuity, moments of truth / recovery, and the GOV.UK Service Standard
  • Brand & visual — Logo usage (clear space, min sizes, variants, placement, restraint), gradient usage (hierarchy, palette, contrast, trend vs signature), imagery (consistency, representation, purpose), visual hierarchy, brand-as-system, and current (2026) visual-design trends
  • Business — Monetization models, retention strategies, onboarding optimization, growth mechanics, and product metrics frameworks
  • Tokens — Design system tokens for Stripe, Linear, and more
  • Creative studio — Local-first brand profiles, asset references, character reference profiles, provider-agnostic image/video/3D/audio generation jobs, campaign plans, and transparent creative scoring. Raven does not ship media-provider credentials; set RAVEN_CREATIVE_RUNNER to route jobs to your own renderer.

Install

Local stdio (npx / from source) is the full product: 115 tools, including Grab, the pattern library, and the file-backed Taste Engine. Hosted endpoints are smaller subsets — pick one path and stick to it.

PathHowToolsTasteGrab
Local stdionpx -y raven-mcp (Claude Code, Cursor mcp.json, Codex, Desktop mcpb)115YesYes
Public remotehttps://mcp.ravenmcp.ai/api/mcp~45NoNo
Auth remotehttps://mcp.ravenmcp.ai/api/mcp-user (OAuth)Taste + audits (no Grab)YesNo
Claude Code — one command
claude mcp add raven -- npx -y raven-mcp

Prefer one Raven entry. If both a local raven and a claude.ai / remote Raven are connected, the agent sees two overlapping toolsets — disable or rename one (e.g. raven-local vs raven-cloud) so it is obvious which product you are talking to.

Manual config (Claude Desktop or team .mcp.json)
{

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

Cursor

Same mcp.json snippet as above (~/.cursor/mcp.json or project .cursor/mcp.json) runs the full local server (Grab + Taste). Hosted options:

  • Public: "url": "https://mcp.ravenmcp.ai/api/mcp" — ~45 stateless tools; no Grab, no Taste.
  • Authenticated Taste: "url": "https://mcp.ravenmcp.ai/api/mcp-user" — OAuth; Taste yes, Grab still local-only.
Codex

Add under mcp_servers in config.toml:

[mcp_servers.raven]

command = "npx" args = ["-y", "raven-mcp"]

Codex may prompt to approve many Raven tools on first use — that is client approval policy, not a smaller Raven.

Claude Desktop — one-click extension

Prefer not to edit JSON? Download raven.mcpb and double-click it. Claude Desktop installs Raven automatically — no Node, no terminal. Package version tracks npm.

From source
git clone https://github.com/rhinocap/raven-mcp.git

cd raven-mcp && npm install && npm run build

Tools

ToolDescription
get_principlesGet design principles relevant to a UI context
get_patternGet proven patterns for a specific UI type
get_business_strategyGet business/monetization strategies
evaluate_designEvaluate a design description against principles. Pass base64 PNG screenshots (before_screenshot/after_screenshot) for a structured before/after pixel diff with fix_confirmed, changed_ratio, and changed region. Pass compact: true to return only scores and violations (drops full principle/pattern bodies) when the full payload is too large.
search_knowledgeSearch across all principles, patterns, and strategies
get_checklistGet a pre-publish checklist for a UI type
get_d4d_frameworkGet Design for Delight framework templates
list_design_systemsBrowse available design systems
get_design_systemGet tokens for a specific design system
compose_systemMix tokens from different systems
get_brand_systemGet a full system styled like a well-known brand
audit_pageAudit HTML/CSS against Raven's quality standards — pass html for static audit, or url to render headless with optional scroll_settle (step through reveal gates, then return to top) and viewport parameters; containerMaxWidth makes container checks token-aware. Also flags inline SVG icons that hardcode a color instead of using currentColor/a token. Pass compact: true to return only scores, violations, and fix_priority (drops embedded base64 screenshots) when the full payload is too large.
score_pageReturn a per-category (0–10) design score for a page — typography, accessibility, spacing, color, responsive layout, design tokens, structure — derived from the same checks as audit_page, plus the overall score/grade, the weakest category, and categories Raven does not mechanically assess (brand, conversion, motion). URL mode also counts determinate contrast failures while keeping indeterminate rows out of numeric scoring. Pass html and/or url (url capture is local/stdio only; remote rejects url)
audit_layoutEvaluate visual rhythm, alignment, and optical balance; detects orphan-stretch (a lonely last-row grid/flex card stretching far wider than siblings)
audit_responsive_visibilityRender a URL at multiple breakpoints and flag content elements that are visible on desktop but hidden on mobile (display:none/opacity:0/zero-size) — categorises each as likely-oversight (content vanishing on mobile) vs intentional (decorative)
audit_contrastCompute WCAG contrast for rendered text with tri-state status (pass, fail, indeterminate), effective backdrops, ratio ranges, and delta-to-pass only where the backdrop is determinate
suggest_contrast_fixGiven failing WCAG color pairs, return the minimal fg/bg change that clears the AA/AAA target — concrete passing values to fix audit_contrast failures
audit_urlRender a live URL at each viewport×theme, scroll-settle, fire interactions, capture real pixels + DOM, then run the page/contrast/responsive/blank-media checks plus sliced-image edge-symmetry and hover-state white-wash detection over the captures — every finding tagged confirmed/likely-artifact/inconclusive, ranked by severity. Pass compact: true to return only findings and summary (drops per-capture base64 screenshots) when the full payload is too large.
audit_contentPer-item content verdicts (pass/warn/fail) for headings, prose, CTAs, labels, captions, metrics & outcomes against UX-writing principles + deterministic heuristics (metric needs number+unit; CTA action-led ≤4 words; prose flags passive/jargon/hedging; caption-vs-heading duplication) — with a before→after rewrite suggestion per item. Pure offline
audit_typographyTypographic-scale report over rendered DOM text nodes (or a supplied snapshot) — detects the dominant modular-scale ratio and flags off-scale sizes, checks line-height consistency vs the body rhythm, and flags weight ladders >4 weights or non-standard values. Goes beyond audit_page's pass/fail typography checks
audit_tap_targetsWCAG 2.5.5 / Apple 44pt web tap-target audit — enumerates every interactive element (rendered URL or snapshot) and emits a per-element fix table: selector, role, text, measured w/h, per-axis pixel deficit, and a concrete CSS fix, sorted worst-first
audit_device_frameFlag cropped content in device-mockup frames — frames (container box + intrinsic media + object-fit, or a DevTools snippet) detects object-fit:cover crop loss when frame AR ≠ media AR; clips (first/last frame PNGs) detects baked-in pan/zoom (Ken Burns); edge_frames (PNGs) flags content truncated at a frame edge
audit_video_playbackRender a page and observe whether each actually advances — samples currentTime, readyState, error codes, and autoplay-block state, then classifies each clip into playingpausedstalledemptyerror with evidence. Catches black/non-playing videos that static frame-capture audits miss. Pass url to render and observe, or dom_snapshot for deterministic offline classification
audit_consistencyCorpus/multi-page audit — compares ≥2 pages and flags cross-page divergence in content-container width and hero heading tier, inferring the canonical (modal) value from the corpus when no token is supplied — catching relational defects that single-page audits miss
audit_swiftuiAudit SwiftUI source against Apple HIG — Dynamic Type, semantic colors, 44pt targets, 4/8pt spacing, AccentColor
audit_ios_screenScore a rendered iOS screen from an accessibility/view-hierarchy snapshot — 44pt targets + contrast + rhythm, in points
audit_ios_privacyAudit Info.plist (or Expo app.json) /PRIVACY.md/entitlements/source — usage-string honesty, ATS, Android permissions, bundled secrets, undisclosed default data-egress
audit_rnAudit React Native / Expo source — touchable a11y labels, 44/48pt+hitSlop targets, font scaling, SafeAreaView, dark mode, against iOS HIG + Android Material
generate_design_systemGenerate a custom design system from a brand color
list_content_systemsBrowse brand voice & tone systems (Conversational Product Voice, GOV.UK, Shopify Polaris, Atlassian)
get_content_systemGet a brand's voice attributes, tone shifts, vocabulary, grammar, and content patterns
get_content_principlesGet UX-writing principles — clarity, active voice, error anatomy, inclusive language
get_content_patternGet copy recipes for error messages, empty-state copy, notifications, form validation
get_research_methodGet qualitative, quantitative, or usability research methods with protocols and checklists
get_metrics_frameworkGet a product-metrics framework — HEART, AARRR, North Star, conversion funnel, RICE, OKRs

| get_service_pattern | Get a service design pattern — blueprinting, human handoff, signup-as-service,

ตัดมาแค่ช่วงต้น อ่านต่อใน repo

ถาม PopNx