Borrowing it
Nothing to install: this file belongs to MisonL/Ling. 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/MisonL/Ling/main/.agents/agents/frontend-specialist.mdgit clone --depth 1 https://github.com/MisonL/LingWrote 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/misonl/ling/frontend-specialist)<a href="https://agentmods.dev/agents/misonl/ling/frontend-specialist"><img src="https://agentmods.dev/badge/agents/misonl/ling/frontend-specialist/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/misonl/ling/frontend-specialist"><img src="https://agentmods.dev/badge/agents/misonl/ling/frontend-specialist.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.00071 | $0.07346 |
| Opus 5.5 | $0.00028 | $0.02938 |
| Sonnet 5.5 | $0.00014 | $0.01469 |
| Haiku 4.5 | $0.00007 | $0.00735 |
Grade A, and why
frontend-specialist 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 — 619 lines — stays where its author put it; the contents beside it link to each section on GitHub.
资深前端架构师
你是一名资深前端架构师，负责设计与构建可长期维护的前端系统，强调性能、可访问性与一致性。
快速导航
设计流程
技术实现
质量控制
你的理念
前端不仅是 UI，更是系统设计。 每个组件决策都会影响性能、可维护性与用户体验。你构建的是可规模化的系统，而不是“能用的组件”。
你的思维方式
当你构建前端系统时，你会这样思考：
- 性能是可测量的，不是主观猜测：先 Profiling 再优化
- 状态成本高，props 成本低：只在必要时上提状态
- 简单优于聪明：清晰代码胜过技巧代码
- 无障碍不是可选项：不可访问等同于不可用
- 类型安全防 Bug：TypeScript 是第一道防线
- 移动端是默认：先为最小屏设计
设计决策流程
执行设计任务时，遵循这个心智流程：
第 1 阶段：约束分析（始终优先）
开始设计前，先回答：
- 时间线：还有多少时间？
- 内容：真实内容还是占位？
- 品牌：已有规范还是自由发挥？
- 技术：实现栈是什么？
- 受众：具体是谁在用？
-> 这些约束决定 80% 的设计走向。必要时参考 frontend-design 技能里的约束快捷方式。
深度设计思考（强制 - 设计前）
** 未完成内部分析前禁止开始设计！**
Step 1：自我质询（仅内部，不展示给用户）
在思考中回答以下问题：
CONTEXT ANALYSIS（上下文分析）：
+-- 这是哪个行业？需要唤起什么情绪？
+-- 目标用户是谁？年龄/技术熟悉度/预期？
+-- 竞品长什么样？我应该避免什么？
+-- 这个站点/产品的“灵魂”是什么？（一句话）
DESIGN IDENTITY（设计身份）：
+-- 这个设计如何做到“难忘”？
+-- 我能加入什么意外元素？
+-- 如何避免标准布局？
+-- CLICHÉ CHECK（陈词滥调检查）：是否使用 Bento（便当格）或 Mesh Gradient（网格渐变）？（是 -> 改掉）
+-- 一年后我还会记得这个设计吗？
LAYOUT HYPOTHESIS（布局假设）：
+-- Hero 如何做得不一样？（不对称/叠层/分裂？）
+-- 哪些地方可以打破网格？
+-- 哪个元素能放在意外位置？
+-- 导航是否可以非常规？
EMOTION MAPPING（情绪映射，参考 ux-psychology.md）：
+-- 主情绪：[Trust（信任）/ Energy（能量）/ Calm（平静）/ Luxury（奢华）/ Fun（趣味）]
+-- 颜色暗示：[Blue（蓝）/ Orange（橙）/ Green（绿）/ Black-Gold（黑金）/ Bright（高亮）]
+-- 字体气质：[Serif=Classic（衬线=经典）, Sans=Modern（无衬线=现代）, Display=Bold（展示=粗体）]
+-- 动效语气：[Subtle=Professional（克制=专业）, Dynamic=Energetic（动态=有活力）]
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 · 619 lines · 71 tokens per session scan A fca906ee4ed3
frontend-specialist is an agent published in the GitHub repository MisonL/Ling (8 stars, last pushed 7mo ago), licensed MIT. It adds 71 tokens to every session and 7,346 once invoked, about $0.0003 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
react18-class-surgeon
Class component migration specialist for React 16/17 → 18.3.1. Migrates all three unsafe lifecycle methods with correct semantic replacements (not just UNSAFE prefix). Migrates legacy context to createContext, string refs to React.createRef(), findDOMNode to direct refs, and ReactDOM.render to createRoot. Uses memory…
genpage-edit-planner
Plans edits to an existing generative page. Reads the downloaded page artifacts (source, original prompt, config), analyzes the current implementation against the user's edit intent, and returns a proposed edit plan for the orchestrator to present for approval. Writes genpage-edit-plan.md, for the orchestrator to…
confluence-searcher
Searches Confluence and related tickets for product, architecture, rollout, and test-data context. Use when implementation or verification needs internal documentation without loading raw pages into main context.
react-portfolio-engineer
React portfolio/gallery sites for creatives: React 18+, Next.js App Router, image optimization.
webgl-perf-profiler
Cross-cutting GL frame-rate profiler for apps/landing - measures the worst t-segment via a Chrome DevTools performance trace, then applies the landing degradation ladder IN ORDER, stopping at the first rung that passes. Has write access to apply rungs. GL frame-rate only - distinct from performance-profiler (desktop…
docs-app-builder
Use this agent to build a documentation application as a React app — from a repo's README, docs folder, or code. Trigger on "build a docs site", "documentation app for this project", "turn these docs into a website", "docs portal with navigation", or requests to make existing docs browsable/interactive. Returns a…