frontend

frontend is an agent for Claude Code from navid-kianfar/claude-memory-mcp. It costs 16 tokens per session (1,147 once invoked), scanned A, original, MIT.

A frontend engineering agent that builds the part of an application users see and interact with in a browser. It implements the designer's specification and checks the result in a real browser.

In plain words
What is it for?
Use it to implement web pages and components, exercise changed interactions, inspect page structure, and verify responsive behaviour.
Why use it?
It catches problems that code inspection alone can miss, such as broken interactions, console errors, layout changes, accessibility issues, and different screen sizes or colour schemes.

Agent for Claude Code

Written for Claude Code: effort in frontmatter.

Good fit Use it to implement web pages and components, exercise changed interactions, inspect page structure, and verify responsive behaviour.

Compare 6 agents from other repositories ↓
Install with agentmods
npx agentmods add agents/navid-kianfar/claude-memory-mcp/frontend
Install

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.

Clone the repo
git clone --depth 1 https://github.com/navid-kianfar/claude-memory-mcp

Made for: Claude Code.

Wrote 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.

agentmods badge for frontend

README.md
[![agentmods](https://agentmods.dev/badge/agents/navid-kianfar/claude-memory-mcp/frontend/github.svg)](https://agentmods.dev/agents/navid-kianfar/claude-memory-mcp/frontend)
Your own site
<a href="https://agentmods.dev/agents/navid-kianfar/claude-memory-mcp/frontend"><img src="https://agentmods.dev/badge/agents/navid-kianfar/claude-memory-mcp/frontend/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.

agentmods 80×15 button for frontend

Your own site · 80×15
<a href="https://agentmods.dev/agents/navid-kianfar/claude-memory-mcp/frontend"><img src="https://agentmods.dev/badge/agents/navid-kianfar/claude-memory-mcp/frontend.svg" alt="Reviewed on agentmods" width="80" height="20"></a>
Per session 16 Only the description is in the session, so the agent can decide to use it. The body loads when it is invoked.
When invoked 1,147 The whole file, excluding the scripts and references it only reads on demand.
Security scan A 0 findings. A grade says what 26 rules found in the file — not that it is safe.
Origin original No closer match found in the catalogue.
Token cost

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.

ModelPer sessionOnce invoked
Fable 5.1 $0.00016 $0.01147
Opus 5.5 $0.00006 $0.00459
Sonnet 5.5 $0.00003 $0.00229
Haiku 4.5 $0.00002 $0.00115

Measured 1mo ago against content hash 2205c23919d3, method: parsed. Prices are Anthropic first-party input rates as of 2026-10-07, from the pricing page.

Security

Grade A, and why

frontend 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.

agents/frontend.md · 81 lines

How it starts

The opening of the file, as written. The whole thing — 81 lines — stays where its author put it; the contents beside it link to each section on GitHub.

You are a frontend engineer with 20+ years of experience, a decade of it on enterprise applications, fluent across web and mobile frameworks. You care about how it feels: smooth interaction, no layout jump, no dead click, no spinner that never resolves. You implement a design exactly as specified — pixel accurate — and you notice the pixel that is wrong. You are a security engineer when writing client code: XSS through unescaped content, secrets in a bundle, tokens in localStorage, unvalidated input trusted on the way out.

Non-negotiables

  • You do not silently redesign. The designer's spec is what you build. A gap in it is a QUESTION, not an invention — an improvised spacing scale or colour is one nobody else knows about and it diverges from every other screen the moment a second person touches it.
  • Verified in a real browser, by you. Never "this should work"; never ask someone else to check. If you did not see it render and respond, it is not done.
  • Tokens, not literals. A hard-coded colour, radius or spacing value is a theme bug waiting for the next palette change. If the token does not exist, that is a question for designer.
  • The states that break are part of the work: empty, loading, error, long text, overflow, slow network, and both colour schemes. A screen that only works with ideal data is not done.
  • Nothing renders unescaped, and no secret reaches the bundle. User content is escaped by default; a token in localStorage or a key in client code is a finding you raise, not a shortcut you take.
  • A bulk action is one request. Deleting or updating many items sends one bulk call, never a loop of per-item requests. If the endpoint does not exist, that is backend's work to report.
  • You do not reshape the server to fit the component. A wrong or missing API shape is backend's work: report it, and never invent an endpoint for someone else to discover.

Currency without hallucination

Read the target before writing for it: package.json, the lockfile, the framework and build-tool versions actually installed. This layer moves fastest of any — router APIs, server components, CSS features and browser support all shift between minor versions. Name a feature with the version it arrived in, mark unverified what you cannot confirm from the repo in front of you, and never invent a prop, a hook or a config key.

Read the full file on GitHub · 81 lines

Changes

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.

  1. 1mo ago Changed · +2 lines 2205c23919d3
  2. 1mo ago Changed · +1 lines 83276d4f5477
  3. 1mo ago Changed · +36 lines 19ee840308d2
  4. 1mo ago First seen · 42 lines · 16 tokens per session scan A 4c4df86f19c5

Subscribe to this mod's changes

frontend is an agent published in the GitHub repository navid-kianfar/claude-memory-mcp (0 stars, last pushed 17d ago), licensed MIT. It adds 16 tokens to every session and 1,147 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-09-05.

Related

Other agents, from other repositories

implementer

Deep implementation work delegated by the lead — writing kit code, writing tests (five-exit-doors discipline), debugging failures, and the implementer self-review pass on a diff. Use for any coding work bigger than a trivial edit. Runs on Opus.

LH8PPL/core-memory-kit · 55 tokens

reviewer

The independent review pass on a diff or PR — ONE holistic pass over the full change (code + tests + docs together), findings ranked Blocking/Important/Minor. Delegated by the lead after the implementer's self-review, as the second pass of the repo's two-pass review discipline. Runs on Opus.

LH8PPL/core-memory-kit · 66 tokens

mechanic

Mechanical, low-judgment work delegated by the lead — boilerplate, scaffolding, multi-file sweeps and renames, doc formatting, test fixtures, applying an exactly-specified pattern across many files. NOT for tests, logic, or anything requiring design judgment. Runs on Sonnet.

LH8PPL/core-memory-kit · 62 tokens

checklist-verifier

Independently verifies that a checklist item was actually completed by re-reading the resulting code against the item's acceptance criteria. Adversarial — tries to prove the item is NOT done — and READ-ONLY, so it cannot bias itself by fixing. Returns a pass/fail VERDICT with observed evidence. Use as the verifier…

LogicLabsAI/ultramemory-mcp · 78 tokens

checklist-worker

Executes one or more assigned checklist items verbatim from the spec it is handed — never from memory or assumption. Touches only the files the item names, makes the minimal change that satisfies every acceptance criterion, and returns a structured PROOF. Use as the worker agentType in checklist-bound-execution…

LogicLabsAI/ultramemory-mcp · 66 tokens

scout

Codebase reconnaissance agent. Maps structure, detects tooling, extracts conventions, identifies risk zones. Spawned by orchestrator on first interaction with unfamiliar codebase or when discovery is needed.

ariaxhan/kernel-claude · 39 tokens