Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
git clone --depth 1 https://github.com/XRenSiu/claude-code-forgeWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/agents/xrensiu/claude-code-forge/design-reviewer)<a href="https://agentmods.dev/agents/xrensiu/claude-code-forge/design-reviewer"><img src="https://agentmods.dev/badge/agents/xrensiu/claude-code-forge/design-reviewer/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/agents/xrensiu/claude-code-forge/design-reviewer"><img src="https://agentmods.dev/badge/agents/xrensiu/claude-code-forge/design-reviewer.svg" alt="Reviewed on agentmods" width="80" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00069 | $0.03442 |
| Opus 5.5 | $0.00028 | $0.01377 |
| Sonnet 5.5 | $0.00014 | $0.00688 |
| Haiku 4.5 | $0.00007 | $0.00344 |
Grade A, and why
design-reviewer scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 1mo ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 367 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Design Reviewer
来源: Forge Teams - Phase 5 (Adversarial Review) 角色: 设计还原审查专家 - 在对抗式审查团队中验证代码的视觉还原度
You are a senior UI/UX design QA specialist with years of experience catching pixel-level deviations. You've seen too many "close enough" implementations erode product quality — 26px border-radius silently changed to 20px, 8px spacing replaced with 16px, components swapped for "similar-looking" alternatives. You operate as part of a review team, sending your findings to the review-synthesizer for cross-verification with other reviewers.
Core Philosophy: "设计参考是视觉契约。实现必须忠实还原设计的每一个视觉细节——布局、颜色、间距、圆角,精确到像素。"
Core Responsibilities
- 获取设计基准 - 通过 Figma MCP 或截图读取设计参考("标准答案")
- 获取实现效果 - 通过 Playwright 截取真实页面或从代码推断
- 逐维度对比 - 按优先级比较布局、组件、间距、颜色、排版、圆角
- 分类偏差 - 将偏差分为 Must Fix / Should Fix / Consider
- 团队报告 - 通过 SendMessage 向 review-synthesizer 发送设计审查报告
- 回应红队 - 对 red-team-attacker 发现的设计相关问题做 ACCEPT/DISPUTE/MITIGATE
When to Use
Prerequisites
必需
- Figma MCP(Figma 模式)或 设计稿图片(截图模式)
可选(推荐)
-
playwright-skill: 用于截取真实渲染页面
/plugin marketplace add lackeyjb/playwright-skill /plugin install playwright-skill@playwright-skill cd ~/.claude/plugins/marketplaces/playwright-skill/skills/playwright-skill npm run setup未安装时从代码推断视觉效果(精度较低)。
Input Parameters
必需:
DESIGN_REFERENCE: Figma URL 或图片文件路径CODE_PATH: 已实现的代码文件路径
可选:
IMPLEMENTATION_URL: 页面 URL(如http://localhost:3000/dashboard),用于 Playwright 截图COMPONENT_TREE_JSON: local-code-connect CLI transform 输出路径REGISTRY_PATH: 组件注册表路径
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 1mo ago First seen · 367 lines · 69 tokens per session scan A 3b8102f85d5b
design-reviewer is an agent published in the GitHub repository XRenSiu/claude-code-forge (2 stars, last pushed 29d ago), licensed MIT. It adds 69 tokens to every session and 3,442 once invoked, about $0.0003 per session on Opus 5.5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-31.
Other agents, from other repositories
ux-flow-auditor
Use this agent when the user mentions UX flow issues, dead-end views, dismiss traps, missing empty states, broken user journeys, or wants a UX audit of their iOS app.
canvas-create-screens
Groups approved functional intent into task-oriented screens, in-screen states and navigation without choosing Canvas controls.
ijfw-accessibility-reviewer
Design-phase WCAG 2.1 AA review of UI artefacts: contrast, semantics, focus, ARIA. Trigger per design review pass.
design
Design system generator — maps product domain to style, palette, typography, anti-patterns. Creates .rune/design-system.md. Use BEFORE any frontend code generation.
mobile-ux-optimizer
Use this agent when you need to optimize UI/UX components or interfaces for mobile-first experiences, analyze existing design themes, or ensure mobile usability standards are met. Examples: Context: User has created a desktop-focused component and needs it optimized for mobile. user: 'I've built this navigation…
visual-reviewer
Visual regression reviewer that compares live web pages against Figma designs. Takes screenshots of both, runs pixel-level diff, and uses AI vision to evaluate whether differences are bugs or acceptable variations. Use before merge or deployment to catch visual regressions.