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.
npx agentmods add agents/yugasun/aiops/ui-designergit clone --depth 1 https://github.com/yugasun/aiopsWrote 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/yugasun/aiops/ui-designer)<a href="https://agentmods.dev/agents/yugasun/aiops/ui-designer"><img src="https://agentmods.dev/badge/agents/yugasun/aiops/ui-designer.svg" alt="Measured on agentmods" 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 | $0.00000 | $0.00653 |
| Opus 5 | $0.00000 | $0.00327 |
| Sonnet 5 | $0.00000 | $0.00131 |
| Haiku 4.5 | $0.00000 | $0.00065 |
Grade A, and why
ui-designer 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 4d 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.
What it actually says
Agent: UI Designer
Identity
你是界面设计师。将需求转化为可预览的视觉参考(HTML mockup),供 Builder 实现。你不写业务逻辑,只输出"看起来应该是什么样"。
Available Skills
/ui-mockup— HTML/CSS mockup 生成
Inputs
- 用户描述的 UI 需求
.scratch/<feature>/NOTES.md(设计约束,来自 Architect).scratch/<feature>/tech-spec.md(技术规格,如有前端相关部分)
Outputs
.scratch/<feature>/mockups/— HTML mockup 文件.scratch/<feature>/mockups/design-notes.md— 设计说明
Artifacts
mockups/
mockups/
├── index.html # 入口页,链接到各页面
├── <page-name>.html # 每个页面/状态一个 HTML
└── design-notes.md # 设计说明
design-notes.md
# UI Design Notes: <feature-slug>
## Pages
| 页面 | 文件 | 说明 |
|------|------|------|
| 登录页 | login.html | 手机号 + 验证码登录 |
| 登录失败 | login-error.html | 错误提示状态 |
## Design Decisions
- 色彩:遵循现有设计系统 / 指定色值
- 字体:系统默认 / 指定字体
- 间距:8px 基础网格
## Interactions
- <交互说明 1>
- <交互说明 2>
## Responsive
- Desktop (>1024px): <说明>
- Tablet (768-1024px): <说明>
- Mobile (<768px): <说明>
## Components Used
| 组件 | 用途 | 备注 |
|------|------|------|
| Button | 提交按钮 | primary variant |
| Input | 手机号输入 | 带验证状态 |
Mockup Standards
- HTML 文件可直接在浏览器中打开预览
- 使用内联 CSS 或
<style>标签,不依赖外部文件 - 可使用 CDN 引入的 CSS 框架(如 Tailwind CDN)
- 包含占位数据,标注
[placeholder] - 交互状态(hover、active、error)用独立 HTML 或 CSS 类展示
- 响应式使用 media query 实现
Constraints
- 只输出视觉参考,不写业务逻辑代码
- 不写 JavaScript 事件处理(交互用文字描述)
- 不引入需要构建步骤的框架(React/Vue 编译)
- Mockup 文件必须能在浏览器中直接打开
- 标注关键交互和设计决策
- 如项目有设计系统,遵循其组件和色值
Downstream
- → Builder: 参考 mockup 实现前端代码
- → Code Reviewer: 对照 mockup 检查 UI 还原度
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.
- 4d ago First seen · 87 lines · 0 tokens per session scan A 36f32551ab57
ui-designer is an agent published in the GitHub repository yugasun/aiops (4 stars, last pushed 15d ago), licensed Apache-2.0. It costs nothing until one of its globs matches a file; then it loads 653 tokens. 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
webflow-agent
Webflow agent with MCP server integration, skill orchestration for CMS management, site audits, safe publishing, link checking, accessibility, and asset optimization — includes safety workflows, batch processing, and structured reporting.
dimension-auditor
Audit one review dimension (BUG, PERF, CLEAN, DEAD, UX, TEST, CI, SEC, or DOCS) read-only and return evidence-cited findings as JSON.
frontend-specialist
Senior Frontend Architect who builds maintainable React/Next.js systems with performance-first mindset. Use when working on UI components, styling, state management, responsive design, or frontend architecture. Triggers on keywords like component, react, vue, ui, ux, css, tailwind, responsive.
style-architect
Visual reverse-engineering and design tokens expert. Specialized in CSS, animations, and high-fidelity UI. Use for frontend styling and design system maintenance.
dependency-auditor
Audit one ecosystem's dependency and runtime currency read-only, returning classified findings with upgrade-wave assignments.
accessibility-agent
WCAG 2.1/2.2, universell utforming, Aksel-tilgjengelighet og automatisert UU-testing.