品牌资产管理工具

BNB BrandClaw是一个为BNB Chain开发者生态系统提供的品牌资产管理工具,包括品牌颜色、徽标、合同模板和UI组件,可通过MCP兼容的AI助手快速生成品牌项目。

  • by Moya-2025-Moya
  • TypeScript
  • 本地部署
  • 更新于
在 GitHub 查看 Moya-2025-Moya/bnb-brand-asset-mcp

使用说明

BNB品牌爪

品牌资产MCP服务器+BNB链AI项目生成器

[HAKATHON_NAME]提交

这是什么?

BNB BrandClaw填补了BNB Chain开发者生态系统中的品牌资产缺口。虽然 bnbchain-mcp 处理链上操作和 Ask AI MCP 涵盖文档, 官方品牌资产没有工具该项目提供:

  1. MCP服务器 (bnb-brandclaw)--4个工具,为任何兼容MCP的AI助手提供官方BNB-Chain品牌颜色、徽标、合同模板和UI组件
  2. 前端演示 --一个网络应用程序,使用克劳德的代理循环在30秒内生成完整的品牌BNB-Chain项目

快速开始

使用带有Claude Desktop的MCP服务器

添加到您的Claude桌面配置(claude_desktop_config.json):

{
  "mcpServers": {
    "bnb-brandclaw": {
      "command": "npx",
      "args": ["-y", "bnb-brandclaw"]
    }
  }
}

然后问克劳德: “创建带有品牌登录页面的BEP20代币”

运行前端演示

git clone <this-repo>
cd bnb-brand-asset-mcp
npm install
npm run dev:frontend

打开 http://localhost:3000,输入您的Claude API密钥,然后生成一个项目。

MCP工具

工具 说明
get_brand_colors 官方BNB-Chain调色板、CSS变量、顺风配置、排版
get_logo 带有使用指南的徽标SVG(亮/暗、全/图标)
get_contract_template BEP20/BEP721与Hardhat配置(OpenZeppelin)的Solidity合同
get_ui_component ConnectWallet和NetworkSwitcher React组件

建筑

bnb-brand-asset-mcp/              (monorepo, npm workspaces)
├── packages/
│   ├── mcp-server/               (npm: bnb-brandclaw)
│   │   ├── src/
│   │   │   ├── index.ts          (CLI entry, stdio transport)
│   │   │   ├── server.ts         (McpServer + tool registration)
│   │   │   ├── tools/            (4 tool modules)
│   │   │   ├── data/             (brand data layer)
│   │   │   └── assets/           (logo SVGs)
│   │   └── package.json
│   │
│   └── frontend/                 (Next.js 14, Vercel)
│       ├── src/
│       │   ├── app/              (pages + API route)
│       │   ├── components/       (landing + generate UI)
│       │   ├── hooks/            (SSE consumption, localStorage)
│       │   └── lib/              (tools, executor, templates, zip)
│       └── package.json
│
├── package.json                  (workspaces)
└── README.md

技术栈

  • MCP服务器:TypeScript, @modelcontextprotocol/sdk,佐德
  • 前端:Next.js 14、shadcn/ui、顺风CSS、Shiki、JSZip
  • 合同:Solidity 0.8.20,OpenZeppelin v5,安全帽
  • 人工智能:带手动代理循环+SSE流的Claude API

前端如何工作

  1. 用户输入提示(或选择模板)+他们的Claude API密钥
  2. API路线创建了一个代理循环:Claude调用品牌工具→ 获取结果→ 生成文件
  3. 工具执行嵌入服务器端(直接导入MCP数据,无需单独进程)
  4. 通过SSE的事件流:工具调用、结果、生成的文件、完成
  5. 前端显示实时进度、文件树、语法突出显示的代码和zip下载

补充官方BNB工具

图层 工具 目的
在链上 bnbchain-mcp 区块链操作、查询
文件 Ask AI MCP BNB Chain文档问答
品牌资产 bnb-brandclaw 品牌颜色、徽标、模板、UI

许可证

麻省理工学院