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

Brandsystem MCP — Brand Guidelines for AI

โดย Brandcode-Studioรุ่น 0.18.0i★ –iรันบนเครื่อง
ชื่อใน registryio.github.Brandcode-Studio/brandsystem-mcp

ติดตั้ง

ภาพรวม

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

Use existing brand guidelines with AI. Turn websites, PDFs, and Figma into a .brand runtime.

สามเสาของ PopNx MCP

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

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

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

  • การเชื่อมต่อ: รันบนเครื่อง
  • ช่องทาง (transport): stdio
  • หมวด: ออกแบบ ภาพ และเสียง

ติดตั้ง

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

ก่อนติดตั้ง

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

  • npmติดตั้ง Node.js (มีคำสั่ง npx) ในเครื่อง

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

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

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

{
  "mcpServers": {
    "brandsystem": {
      "command": "npx",
      "args": [
        "-y",
        "@brandsystem/mcp"
      ]
    }
  }
}

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

claude mcp add brandsystem -- npx -y @brandsystem/mcp

เปิดใน Cursor

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

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

{
  "mcpServers": {
    "brandsystem": {
      "command": "npx",
      "args": [
        "-y",
        "@brandsystem/mcp"
      ]
    }
  }
}

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

เปิดใน VS Code

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

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

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

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

ตัวนี้รันในเครื่องคุณ แต่ ChatGPT ต่อได้เฉพาะ server บนอินเทอร์เน็ต ลองเลือกแอปอื่น

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

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

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

รันในเครื่องคุณ รายการเครื่องมือจะขึ้นในแอป AI หลังติดตั้ง

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

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

  • ✓ ผ่าน

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

    ชื่อใน registry ยืนยันด้วยบัญชี GitHub Brandcode-Studio ซึ่งเป็นเจ้าของ repo

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

    ยังมีคนดูแล

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

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

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

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

  • – ไม่เกี่ยว

    endpoint ตอบ

    ตัวนี้รันบนเครื่องคุณ ไม่มี endpoint บนอินเทอร์เน็ต

  • – ไม่เกี่ยว

    ล็อกอินแบบ OAuth

    ตัวนี้รันบนเครื่อง ใช้ค่าที่ตั้งในเครื่องแทน

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

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

    รันในเครื่องคุณ เราอ่านรายการเครื่องมือได้เฉพาะตัวที่มี endpoint บนอินเทอร์เน็ต

เทียบกับตัวอื่นในหมวด ออกแบบ ภาพ และเสียงi

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

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

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

Brandsystem MCP — Brand Guidelines for AI ปลอดภัยไหม?

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

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

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

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

รันบนเครื่องของคุณ โปรแกรม AI จะเปิด server ขึ้นมาเองเมื่อใช้ ข้อมูลไม่ต้องผ่านเซิร์ฟเวอร์ของผู้ทำ (ยกเว้นตัวที่ไปเรียกบริการออนไลน์ต่อ)

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

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

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

โปรแกรมที่รองรับ MCP เช่น Claude Desktop, Claude Code, Cursor และ VS Code ตัวนี้ต้องมี Node.js ในเครื่องด้วย

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

ในหมวดเดียวกันมี Figma Context MCP, Claude Real Video, Figma MCP Server

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

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

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

Figma Context MCP

โดย GLips

Give your coding agent access to your Figma data. Implement designs in any framework in one-shot.

รันบนเครื่อง★ 16,165MITอัปเดต 5 เดือนที่ผ่านมา
ติดตั้ง

Claude Real Video

โดย HUANGCHIHHUNGLeo

Let any LLM watch a video locally — and search everything it has ever watched.

รันบนเครื่อง★ 2,284MITอัปเดต 2 เดือนที่ผ่านมา
ติดตั้ง

Figma MCP Server

โดย figma

server ทางการของ Figma ส่งข้อมูลงานออกแบบให้ AI อ่าน เพื่อเปลี่ยนแบบเป็นโค้ดหรืออธิบายแบบได้ตรงขึ้น ต่อผ่านคลาวด์ของ Figma

รันบนคลาวด์★ 2,152อัปเดต 13 เดือนที่ผ่านมา
ติดตั้ง

README จากผู้ทำ

เปิดอ่าน README

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

Use your brand guidelines with AI

`@brandsystem/mcp` turns the brand material you already have into context AI agents can use. Give it a website, PDF guide, Figma library, local files, or a Brandcode Studio brand. It produces a portable .brand/ runtime with design tokens, voice rules, provenance, and compliance checks.

Local-first. No account required. The default Core profile exposes 12 tools covering the complete adopt → use → check loop.

Start here

Install it for your agent, then ask: “How do I use my brand guidelines with AI?”

# Codex

npx @brandsystem/mcp install --client codex --write

Claude Code, Cursor, Windsurf, or Claude Desktop

npx @brandsystem/mcp install --client claude-code --write

Cline

npx @brandsystem/mcp install --client cline --write

Claude Desktop (one-click): download brandsystem-mcp- .mcpb from the latest GitHub release and double-click it (or drag it into Settings > Extensions). Claude Desktop asks for the folder that holds your .brand/ directory — no Node install or JSON editing needed.

install is a dry run unless you pass --write. Replace claude-code with cline, cursor, windsurf, or claude-desktop as needed. JSON-file targets preserve existing settings; Cline and Codex setup delegate to their official MCP commands so their current schemas remain authoritative. Agents can follow the compact installation guide without reading this entire README.

Already configured? Tell your agent:

Use my existing brand guidelines with AI. Start from this website/PDF/Figma library and show me what needs human confirmation.

What It Solves

AI tools default to category-average output because they have no brand context. Brand guidelines live in PDFs, Figma files, and people's heads — none of which AI tools can read at the moment of creation. The dominant failure mode isn't "broken output"; it's "correct but generic" — output that passes mechanical checks but reads like a competent generalist could have made it.

This MCP server is the authoring half of the "Two MCPs, One Brand" model. It extracts brand identity from live sources, compiles it into a .brand/ directory with structured governance (anti-patterns, proof-point status, voice rules, application rules) plus DTCG tokens, brand-runtime.json, and interaction-policy.json. That directory is the portable brand runtime — the artifact that travels with your brand from surface to surface.

  • Claude Design reads the .brand/ directory natively when pointed at a governed repo
  • Claude Code, Claude Desktop, Cursor, and Windsurf connect to this server directly over stdio and load brand-runtime.json at generation time
  • ChatGPT and other remote-first clients consume the same runtime as an uploaded artifact (brand-report.html / brand-runtime.json) or via a remote MCP connection — see Compatibility
  • @brandcode/mcp (the hosted Use MCP) serves the same runtime over HTTP for teams that want authenticated live reads at mcp.brandcode.studio/{slug}

With brand-runtime.json loaded, agent prompts collapse from 200-400 tokens of inline brand context to just the delta. First output is on-brand. No review bottleneck.


Quick Start

1. Add to your MCP config

Copy this into .mcp.json (Claude Code), .cursor/mcp.json (Cursor), or Windsurf MCP settings. Codex users can run npx @brandsystem/mcp install --client codex --write instead:

{

"mcpServers": { "brandsystem": { "command": "npx", "args": ["-y", "@brandsystem/mcp"] } } }

For project-level configs committed to a repository, pin a version ("@brandsystem/mcp@ ") so collaborators never auto-run an unreviewed release; npx @brandsystem/mcp install writes a pinned spec for you.

2. Create your brand system

Tell your AI tool:

Run brand_start with client_name="Acme Corp", website_url="https://acme.com", and mode="auto"

That single command extracts colors, fonts, and logo from the website, escalates to rendered or deeper multi-page extraction when the cheap pass is weak, compiles DTCG tokens, generates design-synthesis.json + DESIGN.md, and generates a portable HTML brand report -- all in under 60 seconds.

3. What you get
.brand/

brand.config.yaml ← brand name, source URLs, session state core-identity.yaml ← colors (with roles), fonts, logo specs tokens.json ← DTCG design tokens brand-runtime.json ← single-file brand context for any AI agent interaction-policy.json ← anti-patterns, voice constraints, never-say words design-synthesis.json ← spacing, radius, shadows, component signals DESIGN.md ← portable design brief (agent-readable) brand-report.html ← visual report (paste into any AI chat) assets/logo/ ← extracted logo files (SVG/PNG)

Load brand-runtime.json into any sub-agent's context. First output is on-brand. No per-prompt boilerplate.

4. Use it

Run brand_write for a social-graphic about "Q3 product launch"

The AI now has your full brand context — colors, typography, logo, anti-patterns, voice rules — and generates on-brand content.

Export to every tool's native format

Encode the brand once, then drop it into each tool in the format that tool already reads. brand_export writes to .brand/exports/:

TargetOutputWhere it goes
agents-mdAGENTS.md section (between brandsystem:start/end markers)Project-root AGENTS.md — read by Codex, Cursor, and other AGENTS.md-aware agents
cursor-rulesbrand.mdc with description / globs / alwaysApply: false frontmatter.cursor/rules/brand.mdc — auto-attached to UI files
css-variables:root { --brand-color-*; --brand-font-* } plus a [data-theme="dark"] / prefers-color-scheme: dark block when the brand has a dark paletteAny stylesheet
tailwindTailwind CSS v4 @theme { --color-brand-*; --font-brand-*; --radius-brand-* }After @import "tailwindcss";
shadcnshadcn/ui :root + .dark variables (--background, --primary, --ring, --radius …) mapped from brand rolesglobals.css in a shadcn/ui project
claude-skill, chat, code, team, email, pdfSkill file, chat upload, CLAUDE.md snippet, guidelines, summary, PDF guideClaude skills, AI chats, teammates

Run brand_export with target="tailwind"

CSS targets are generated from the compiled DTCG tokens; brand strings are validated (hex colors, plausible font names, quoted families) so nothing extracted can break out of a declaration. Instruction targets (agents-md, cursor-rules) carry the provenance notice and keep brand values in a fenced data block.

5. Go deeper (optional)
SessionWhat it addsCommand
1. Core IdentityColors, fonts, logo, tokensbrand_start (done above)
2. Visual IdentityComposition, anti-patterns, illustration stylebrand_deepen_identity
3. MessagingVoice, tone, never-say words, brand storybrand_compile_messaging
4. Content StrategyPersonas, journey stages, themesbrand_build_personas

Each session enriches brand-runtime.json. Stop at any point — Session 1 alone is valuable.

6. Share with your team

Run brand_brandcode_connect to save on Brandcode Studio

Your brand persists on brandcode.studio. Teammates pull the same brand into their tools. One source of truth.


What It Does

Session 1: Core Identity -- Extract colors, fonts, and logo from a website or Figma file. Compile into DTCG tokens, a structured design synthesis layer, a portable DESIGN.md, and an HTML report.

Session 2: Visual Identity -- Define composition rules, pattern language, illustration style, and anti-patterns through a guided interview. Anti-patterns become enforceable compliance rules.

Session 3: Messaging -- Audit existing website voice, then define perspective, voice codex (tone, vocabulary, AI-ism detection), and brand story through a guided interview.

Session 4: Content Strategy -- Build buyer personas, journey stages, editorial themes, and a persona x stage messaging matrix.

Each session builds on the previous. Stop anywhere -- you get value immediately.

Two Ways To Use It

Local-first MCP flow -- Start from a website or Figma file, build a .brand/ directory locally, and use it immediately in chat or code tools with no account required.

Brandcode Studio-connected flow -- Connect an existing hosted brand from Brandcode Studio, pull the packaged brand into .brand/, and keep it synced over time.

Two MCPs, One Brand

The .brand runtime is the product. Two MCPs serve it:

`@brandsystem/mcp` — Build (this package). Author and compile the .brand runtime locally. Extract from websites, Figma, and PDFs. Compile governance (anti-patterns, proof-point status, voice rules, application rules) plus DTCG tokens, brand-runtime.json, and interaction-policy.json into a single .brand/ directory. Portable, versionable, ready to commit to any repo.

`@brandcode/mcp` — Use (hosted). Connect authorized MCP clients to the live Full Brand Runtime at https://mcp.brandcode.studio/{slug} with Brandcode bearer-key auth. Agents fetch the current runtime, search approved knowledge, check drafts, retrieve package-safe assets, leave append-only review feedback, and, with explicit capture scope, queue taste captures for human review — no per-tool guideline copy, no stale snapshots, no canonical mutation from the MCP. Tagline: *"Your brand, live in every AI tool."*

Same .brand runtime artifact. Two consumption paths. Build authors it; Use serves it.

Phase 0 for Brandcode MCP is locked in specs/brandcode-mcp-phase-0-lock.md as the original 8-tool read/append-only surface. The current hosted implementation adds capture_taste as a scoped contribute-tier tool: it requires explicit capture scope, queues a review candidate for human review, and never promotes canon.

Hosted availability: Brandcode MCP is pre-release and available to approved clients only — it is not yet publicly launched or registry-listed. Brand data on the hosted service is client-owned; feedback is append-only; agent history is scoped and redacted. Deletion and export requests are handled through your Brandcode Studio contact. Until public launch, use @brandsystem/mcp for local build/sync, and Live Mode (brand_brandcode_live) for connected reads that refresh from the hosted runtime within a short cache TTL.

Maintainers can verify a hosted deployment end-to-end with the smoke harness (npm run smoke:hosted-mcp with BRANDCODE_MCP_SMOKE_URL and scoped test keys). It verifies MCP initialize, tools/list, the locked hosted tool order, core hosted tool calls, and read-only insufficient-scope behavior. It never hardcodes keys; mi

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

ถาม PopNx