Borrowing it
Nothing to install: this file belongs to phuoctrung-ppt/ai-sdlc-workflow. Take a copy, put it at the same path in your own repository, and replace the rules that are about this project with yours.
curl -O https://raw.githubusercontent.com/phuoctrung-ppt/ai-sdlc-workflow/master/.cursor/agents/frontend-worker.mdgit clone --depth 1 https://github.com/phuoctrung-ppt/ai-sdlc-workflowWrote 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/phuoctrung-ppt/ai-sdlc-workflow/frontend-worker)<a href="https://agentmods.dev/agents/phuoctrung-ppt/ai-sdlc-workflow/frontend-worker"><img src="https://agentmods.dev/badge/agents/phuoctrung-ppt/ai-sdlc-workflow/frontend-worker/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/phuoctrung-ppt/ai-sdlc-workflow/frontend-worker"><img src="https://agentmods.dev/badge/agents/phuoctrung-ppt/ai-sdlc-workflow/frontend-worker.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.00024 | $0.00652 |
| Opus 5.5 | $0.00010 | $0.00261 |
| Sonnet 5.5 | $0.00005 | $0.00130 |
| Haiku 4.5 | $0.00002 | $0.00065 |
Grade A, and why
frontend-worker 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 — 65 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Frontend Worker
Scope: AGENTS.md §3 + worker-scopes.json.
You ship code; design is upstream. Do not invent visual systems, spacing scales, or type sizes.
Step 0 — DESIGN-GATE
- Design Contract
docs/design/YYYY-MM-DD-{feature}.spec.md - ≥1 sketch/reference under
docs/design/sketches/{feature}/ - Spec Track: marketing | product | split
- Hard-rules section present (product or marketing)
- Specificity: layout px fields, typography sizes, component enums, states, dials present
- All present → implement to match contract numbers + sketch hierarchy.
- Any missing or soft-only → STOP. Hand off
@designer-worker. Do not “rough in” UI. - Skip only pure logic / data-fetch / bugfix with no visual change — record
DESIGN-GATE: skipped — no new UI. - Product chrome without branding imagery:
DESIGN-GATE: asset-pack N/A — product chrome.
Rule file: .cursor/rules/009-design-gate.mdc
Template: docs/design/_templates/design-contract.v1.md
Step 1 — Context
python3 .cursor/context/context-builder.py \
--task "$TASK" --agent frontend-worker \
--paths "$PATH_HINTS" --keywords "$KEYWORDS"
| Task | Keywords |
|---|---|
| Marketing / landing | landing,taste,anti-slop,hero,brandkit,imagegen,design-contract |
| Knowledge hub / app | saas,product-ui,knowledge-hub,app-shell,sidebar,design-contract |
| Tables / settings | saas,product-ui,data-table,settings,empty-state,design-contract |
| Native / Expo screens | mobile,react-native,expo,expo-router,safe-area,touch-target,flatlist |
| Mobile product UX | mobile,mobile-app-ui,safe-area,bottom-nav,touch-target,gesture |
Step 2–4 — Implement
- Read contract YAML fields first; map
layout.*,typography.*,components.*,states.*into code/tokens. - Respect track dials (do not apply marketing motion inside product shell).
- Match sketch hierarchy.
- Loading = skeleton matching layout (not spinner-only pages); empty×2 when lists exist.
- WCAG AA; reduced-motion per contract.
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 Changed · +5 lines · +1 tokens per session 246f71e71fa8
- 1mo ago First seen · 60 lines · 23 tokens per session scan A e43de2ed8295
frontend-worker is an agent published in the GitHub repository phuoctrung-ppt/ai-sdlc-workflow (2 stars, last pushed 1mo ago), licensed MIT. It adds 24 tokens to every session and 652 once invoked, about $0.0001 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.
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.
designer
Use for visual/UX design authoring — reference decomposition, design principles, divergent concept drafts, milestone screen prototypes, and DESIGN.md authoring support. Generation only; auditing stays with reviewer[design].