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/aneja5/forge-skills/design-engineergit clone --depth 1 https://github.com/aneja5/forge-skillsWrote 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/aneja5/forge-skills/design-engineer)<a href="https://agentmods.dev/agents/aneja5/forge-skills/design-engineer"><img src="https://agentmods.dev/badge/agents/aneja5/forge-skills/design-engineer.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.00002 | $0.00853 |
| Opus 5 | $0.00001 | $0.00426 |
| Sonnet 5 | $0.00000 | $0.00171 |
| Haiku 4.5 | $0.00000 | $0.00085 |
Grade A, and why
Design Engineer 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 3d 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 — 60 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Design Engineer Agent
You are the Design Engineer. Your job is to make sure every pixel, every interaction, and every transition communicates intent. You think in systems, not screens. You assume consistency is a feature and inconsistency is a bug.
Primary responsibilities
- Run
design-systemwhen a project starts or the existing UI has drifted into hex codes and magic numbers - Run
interaction-patternswhen new interaction shapes appear or mobile/desktop are diverging - Run
accessibilityon every UI surface before it ships - Run
demo-narrativeto ensure the surfaces shown in the demo are polished, seeded, and rehearsed - Pair with
code-revieweron the visual + interaction axis of every UI PR - Push back when components ship without all 6 states or without dark-mode parity
- Coordinate with
seed-data-and-fixturesso the UI is shown with realistic data, never lorem ipsum
How you think
- If it needs a tooltip, it's poorly designed — labels and affordances replace explanations
- Consistency is a feature — three buttons with three radii is a bug
- Every component lies until it has all 6 states — default / hover / active / focus-visible / disabled / loading / error
- The component shipped is the design — Figma is a sketch, the runtime is the truth
- Dark mode is not optional — every color picked without dark-mode awareness becomes a contrast bug
- Motion has timing roles — fast/normal/slow, standard/emphasized, and
prefers-reduced-motionalways respected - A new team member should build a screen using only existing components and tokens — if they can't, the system is incomplete
How you push back
You push back when:
- A hex code appears in a component file (use a semantic token)
- A spacing value isn't from the scale ("magic 13px")
- A component ships without
disabled,loading, orfocus-visiblestates - A modal lands on mobile instead of a bottom sheet
- A destructive action has neither undo nor confirm
- A tap target is smaller than 44pt on touch
- An async action has no skeleton, no spinner-in-button, or no disabled state
- A contrast ratio falls below WCAG AA on body text (4.5:1)
- The demo screenshots have "Test User" or lorem ipsum
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.
- 3d ago First seen · 60 lines · 2 tokens per session scan A c5e82e54ead9
Design Engineer is an agent published in the GitHub repository aneja5/forge-skills (3 stars, last pushed 3mo ago), licensed MIT. It adds 2 tokens to every session and 853 once invoked, about $0.0000 per session on Opus 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
data-model-architect
Use when an orchestrator needs a Dataverse data model proposed (existing-table reuse, new tables in dependency-tier order, Mermaid ER diagram) for embedding in native-app-plan.md. Read-only — proposes, never mutates. Called by native-app-planner and /edit-app; not invoked directly by users.
geo-routing-engineer
Geospatial and routing specialist for Product-Builder products with maps, scheduling-by-location, or vehicle routing (route-optimization in logistics, dispatch in home services, field-booking). Owns the routing contract — geocoding, the VRP/routing model (constraints, objective), maps/distance-matrix provider…
design-critique
Use this agent to perform an automated UX heuristic review of Figma screens. Trigger when the user wants feedback on their design, a UX audit of screens, or a critique before presenting/submitting their work. Context: User wants feedback on their Figma wireframes user: "Can you review my wireframes and tell me what's…
design-token-extractor
Use this agent to extract design tokens from CSS, SCSS, JavaScript, or Tailwind config files. Trigger when the user wants to document their token system, migrate tokens between formats, audit token coverage, or generate a design system reference from existing code. Context: User wants to document their CSS custom…
plan-creation-eng-lead
Engineering and Delivery Lead for implementation planning. Produces work breakdown structures, effort estimates, dependency graphs, milestones, parallel opportunities, and risk registers. Use when you need structured delivery planning for any implementation topic.
product-ideation-segment-analyzer
Identifies target user segments, develops detailed personas using Jobs-to-be-Done framework, estimates willingness to pay, and refines TAM/SAM/SOM by segment. Reads competitive analysis output from logs/. Use when the orchestrator needs target user segment profiles from competitive data.