Getting it into your agent
It runs from inside its repository, so the clone comes first — what it calls does not travel with the file alone.
git clone --depth 1 https://github.com/Light0305/Light-skillsnpx agentmods add skills/light0305/light-skills/light-frontend-designWrote 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/skills/light0305/light-skills/light-frontend-design)<a href="https://agentmods.dev/skills/light0305/light-skills/light-frontend-design"><img src="https://agentmods.dev/badge/skills/light0305/light-skills/light-frontend-design/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/skills/light0305/light-skills/light-frontend-design"><img src="https://agentmods.dev/badge/skills/light0305/light-skills/light-frontend-design.svg" alt="Reviewed on agentmods" width="80" height="20"></a>- NVIDIA SkillSpector warn
SkillSpector: 1 finding, up to medium
These are SkillSpector’s own severities. On a checked sample its high-severity flags on skills were ~96% false positives — a documented command, a public API, a “never do X” rule — so we show them as a caution to read, not a verdict. Why →
- medium MCP Rug Pull · line 83 npx commands without a version suffix (e.g. @1.0.0) create a rug-pull risk if the upstream server is compromised and publishes a malicious update.Fix: Pin the version: npx @scope/[email protected]
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.00459 | $0.06551 |
| Opus 5.5 | $0.00184 | $0.02620 |
| Sonnet 5.5 | $0.00092 | $0.01310 |
| Haiku 4.5 | $0.00046 | $0.00655 |
Grade A, and why
light-frontend-design 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 2mo 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 — 221 lines — stays where its author put it; the contents beside it link to each section on GitHub.
前端设计(frontend-design)—— 按需工程技能 · 可落地 + 反 AI-slop + 视觉无障碍
你是 Light 的前端设计归属方:任何任务一旦涉及「做界面 / 做网页 / 做应用 UI / 改造现有前端 / 选配色字体设计系统」, 你被按需调用。Light 的可验证组合是【反 AI-slop 机检 + WCAG 复用 visual_qa + 可数版面门 + 真实 Chromium QA + 在线找灵感 + 决策点不替用户拍板】。不宣称市场永久唯一;交付不是一张图或空话,而是 能在真实浏览器里跑起来的前端代码 + 为什么这么设计的决策说明。
一句话定位:把「做个好看的界面」从「丢一张 AI 味十足的渲染图」升级成「先问场景与方向 → 在线找灵感学审美 → 出能跑的 React/Tailwind/shadcn 代码(有记忆点、适配场景)→ 四路自查(对比度/反 slop/版面/真实浏览器)+ 渲染回看 → 修到无 critical」; 把「确定性脏活」(WCAG 对比度判定、AI-slop 痕迹检测、可数版面体检)干净利落地机检掉,把「设计方向」这件 AI 不该自主的事 降级成「推荐 + AskUserQuestion」。对标判据唯一真相源 =
docs/competitors/frontend-design.md(Round 2 R1:8 真·同类设计 skill 实搜读码,ui-ux-pro-max 95.4K★/taste-skill 49.4K★ 等头部 + 机制锚分表; 诚实校正:反 slop/a11y 清单/组件找料是同类共识,头部已覆盖——Light 增量=输出质量机检门[ai_tell_lint 可复现机标 + contrast_lint 真算 WCAG 比值,非 ui-ux-pro-max 的"清单写 4.5:1"] + 零本地库在线找 + 决策点不替用户拍板,非"想到 AI-slop")。
门型诚实(与科研主线 13 技能根本不同——开做前必读)
frontend-design 不是科研 DAG 节点(一手核实,非转述):
run_checkpoint.py STAGE_GATES/reroute.py ROUTES/orchestrator-spec.md三处 grepfrontend零命中 ⇒ 非主线阶段、非 STAGE_GATES 闸门、非回边发起方、无上下游 DAG 接线。 当前公开版的工程/IP off-DAG 技能(frontend / system-design / patent-disclosure / software-copyright)是「做系统/界面/软件作品/成果转化材料时用,按需」,不在 §4.3 的 13 技能主线上。所以本技能是 纯工具(复用
_shared/visual_qa):emits: none、不产light.findings.v1、不被run_checkpoint聚合、绝不阻断主线。 四个自查脚本是技能自己的质量条(供自身 fix-loop),不是科研主线 verdict。 它确实消费_shared/visual_qa(contrast_lint 复用其 WCAG 数学,同 figure 的 figure_visual_qa 先例)——这是复用不是接 DAG。
增量边界(诚实,别把裸模型自带常识当本技能贡献):「留白好看」「对比度要够」「别滥用紫渐变」「typography 要克制」—— 都是强 Opus 自带常识,近零增量。本技能真正超出裸模型的是: ①
ai_tell_lint.py机械抓 AI-slop 痕迹(T1–T8 可核可复现,不靠「我觉得有 AI 味」); ②contrast_lint.py复用_shared/visual_qa把 WCAG 落成机检门(确定性 PASS/FAIL,不靠「看着还行」); ③audit_checklist.py可数版面门(R1–R7 带数字阈值,不靠「布局挺好」); ④ 在线找灵感零本地库(Awwwards 实测可达 +npm view当天核版本,不吃本地腐朽库); ⑤ 决策点纪律(把「定方向/栈/配色」这件 AI 结构性不该自主的事,降级成「推荐 + AskUserQuestion」)。 诚实落后项见文末「名实对齐」。
What ships with it
16 files beside SKILL.md in the same directory: the scripts, references and assets a skill reads on demand. Not counted in the per-session cost; read them before you install if any of them is executable.
- assets/gsap-horizontal-pan.tsx 2.4 KB
- assets/gsap-sticky-stack.tsx 2.5 KB
- assets/motion-scroll-reveal.tsx 1.9 KB
- references.md 5.4 KB
- references/design-systems-map.md 3.6 KB
- references/ecosystem-2026.md 5.1 KB
- references/fonts-and-colors.md 2.5 KB
- references/redesign-audit.md 3.2 KB
- references/resource-map.md 11 KB
- references/visual-a11y-rules.md 3.6 KB
- scripts/ai_tell_lint.py 12 KB runs code
- scripts/audit_checklist.py 11 KB runs code
- scripts/browser_qa.py 12 KB runs code
- scripts/contrast_lint.py 14 KB runs code
- scripts/design_delivery_gate.py 39 KB runs code
- templates/frontend-delivery.example.json 1.4 KB
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.
- 2mo ago First seen · 221 lines · 459 tokens per session scan A 13d53e3f6ca1
light-frontend-design is a skill published in the GitHub repository Light0305/Light-skills (867 stars, last pushed 4mo ago), licensed MIT. It adds 459 tokens to every session and 6,551 once invoked, about $0.0018 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-30.
light-frontend-design compared with skills from other repositories
| Mod | Type | Stars | Last push | Licence | Scan | Tokens | Works with |
|---|---|---|---|---|---|---|---|
| light-frontend-designLight0305/Light-skills | Skill | 867 | 4mo ago | MIT | A | 459 | Claude Code, Codex |
| chakra-ui-builderchakra-ui/chakra-ui | Skill | 41k | yesterday | MIT | A | 214 | Claude Code, Codex |
| antigravity-design-expertsickn33/agentic-awesome-skills | Skill | 49k | yesterday | MIT | A | 39 | Claude Code |
| tamagui-v6-configtamagui/tamagui | Skill | 14k | today | MIT | A | 0 | Claude Code, Codex |
| tamagui-theme-generatortamagui/tamagui | Skill | 14k | today | MIT | A | 48 | Claude Code, Codex |
| liquid-metal-borderMengTo/Skills | Skill | 7.3k | yesterday | MIT | A | 97 | Codex |
| frontend-ui-dark-tsmicrosoft/skills | Skill | 3.2k | yesterday | MIT | A | 48 | Claude Code |