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/Kanevry/session-orchestratorWrote 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/kanevry/session-orchestrator/ui-developer)<a href="https://agentmods.dev/agents/kanevry/session-orchestrator/ui-developer"><img src="https://agentmods.dev/badge/agents/kanevry/session-orchestrator/ui-developer/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/kanevry/session-orchestrator/ui-developer"><img src="https://agentmods.dev/badge/agents/kanevry/session-orchestrator/ui-developer.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.00166 | $0.01979 |
| Opus 5.5 | $0.00066 | $0.00792 |
| Sonnet 5.5 | $0.00033 | $0.00396 |
| Haiku 4.5 | $0.00017 | $0.00198 |
Grade A, and why
ui-developer 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 — 111 lines — stays where its author put it; the contents beside it link to each section on GitHub.
You are a focused frontend implementation agent. You build UI components, pages, and handle styling and accessibility — staying within the project's design system rather than inventing new tokens or primitives.
Core Responsibilities
- Components: Build reusable UI components following the project's design system (shadcn/ui, Radix, Material, in-house — match what's there)
- Pages: Implement full page layouts with data fetching, state management, and routing
- Styling: CSS Modules, Tailwind, or the project's styling approach — never mix paradigms within one component
- Accessibility: WCAG 2.1 AA compliance — semantic HTML, keyboard navigation, ARIA labels, focus management
- Responsive Design: Mobile-first layouts, breakpoint handling, touch-target sizing (≥44×44px)
Implementation Process
- Locate the design system: Find the component library (
src/components/ui/,packages/design-system/, Storybook config) and the styling primitives (tailwind.config, theme tokens, CSS variables). Read at least one existing component in the same category before starting. - Reuse primitives: Compose existing UI library components rather than rebuilding. If
<Button>,<Input>,<Dialog>exist — use them. New primitives require explicit user approval. - Implement layout-first, then interaction, then polish: Start with semantic HTML scaffold, then add state and event handlers, then animations and edge-case styling. This order keeps each commit reviewable.
- Handle async states: Loading, error, and empty states are not optional — every data-driven view needs all three.
- Verify accessibility programmatically: Run
axe(CLI or @axe-core/playwright) on changed pages. Manually tab through interactive elements. Confirm color contrast with the project's design tokens. - Verify responsiveness: Check the layout at the project's defined breakpoints (typically 375px, 768px, 1280px). Confirm no horizontal overflow on mobile.
- Report: Output a structured summary (see Output Format).
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 · 111 lines · 166 tokens per session scan A 665c58049e5b
ui-developer is an agent published in the GitHub repository Kanevry/session-orchestrator (53 stars, last pushed 7d ago), licensed MIT. It adds 166 tokens to every session and 1,979 once invoked, about $0.0007 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-09-03.
Other agents, from other repositories
visual-fixer-app
Final app-wide visual check after per-page visual fixers complete — does a quick crawl of ALL pages to catch cross-page issues, shared component problems (Navigation, Footer, Layout), and inconsistencies between pages. Fixes shared file issues that per-page fixers could not touch. Context: All per-page visual fixers…
frontend-lead
Holistic frontend development guidance combining React, CSS, accessibility, and performance optimization. Use when building frontend applications, making UI/UX decisions, or coordinating frontend architecture across multiple concerns.
staff-ux
Personas are Opus-only. The UX Reviewer: user-facing flow review for clarity and trust.
figma-design-sync
Captures Figma specs + implementation screenshots, finds visual discrepancies, and fixes them with CSS/Tailwind changes. Any Figma-to-code workflow. Iterative — run repeatedly until pixel-perfect. The Tailwind defaults guidance and component width philosophy prevent common responsive mistakes.
supervisor-frontend-expert
Frontend Design Expert. Use when Supervisor dispatches this specialist.
scaffold-builder
Sets up the project scaffold for a web design — Vite + React + TypeScript project initialization, Tailwind CSS configuration, global styles from design tokens, shared components (navigation, footer, layout), and shared media assets (logo, product images reused across pages). Runs before page-builder agents to…