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 skills/ariaxhan/kernel-claude/frontendnpx skills add ariaxhan/kernel-claude --skill frontendgit clone --depth 1 https://github.com/ariaxhan/kernel-claudeWrote 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/ariaxhan/kernel-claude/frontend)<a href="https://agentmods.dev/skills/ariaxhan/kernel-claude/frontend"><img src="https://agentmods.dev/badge/skills/ariaxhan/kernel-claude/frontend.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.00108 | $0.01452 |
| Opus 5 | $0.00054 | $0.00726 |
| Sonnet 5 | $0.00022 | $0.00290 |
| Haiku 4.5 | $0.00011 | $0.00145 |
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 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 — 135 lines — stays where its author put it; the contents beside it link to each section on GitHub.
- Product: what the interface does and which action matters most.
- Audience and use context: device, environment, familiarity, urgency, accessibility needs.
- Brand: existing tokens, logo, type, imagery, voice, screenshots, and reference qualities.
- Content: real density, length, hierarchy, empty/error/loading states, and localization risk.
- Technical constraints: current stack, component library, performance budget, supported browsers.
Preserve and extend the existing design system when one exists. Do not replace a coherent brand because a variant or personal preference is louder. If the evidence is incomplete, make the smallest reversible assumption and state it; ask only when the answer changes the product direction.
- desired feeling in 2-3 plain words;
- one dominant visual idea;
- typography, color, layout, imagery, and motion choices tied to evidence;
- 2-3 defaults to avoid for this specific project.
No choice is universally premium. A system font can be correct for speed or platform familiarity. Symmetry can communicate calm. Flat color can be the strongest choice. Huge type, gradients, glass, noise, asymmetry, and animation are tools—not proof of taste.
Compose freely: any mood x any motion language, either alone, or neither. Context-fit always wins over any lens; a lens bends to the content, never the reverse. Each language's prohibition list is binding while that language is active — bans differentiate more than moves do. All languages inherit the reduced-motion hard bar: every design must survive with its motion stripped.
What ships with it
19 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.
- motion/cursor-field.md 1.8 KB
- motion/grand-tour.md 2.1 KB
- motion/haunted-machine.md 1.8 KB
- motion/held-breath.md 1.8 KB
- motion/kinetic-type.md 1.8 KB
- motion/liquid-material.md 2.0 KB
- motion/one-surface.md 1.9 KB
- motion/real-weight.md 1.8 KB
- reference/component-sources.md 4.4 KB
- reference/design-research.md 12 KB
- variants/abyss.md 1.4 KB
- variants/arctic.md 1.3 KB
- variants/ember.md 1.3 KB
- variants/patina.md 1.4 KB
- variants/signal.md 1.4 KB
- variants/spatial.md 1.4 KB
- variants/substrate.md 1.4 KB
- variants/verdant.md 1.4 KB
- variants/void.md 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.
- 3d ago First seen · 135 lines · 108 tokens per session scan A 814ab84e6965
frontend is a skill published in the GitHub repository ariaxhan/kernel-claude (12 stars, last pushed 4d ago), licensed MIT. It adds 108 tokens to every session and 1,452 once invoked, about $0.0005 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-30.
Other skills, from other repositories
prolong
Recover and use durable coding-session history from PRO-LONG's local append-only log. Use on long-running coding tasks, after context compaction or session resume, when reconstructing prior decisions or tool results, or before repeating work that may already have been attempted.
lemmalog
Externalize working memory and logical state into the lemmalog Datalog engine (MCP). Use for ANY multi-step task where state should outlive one context window or span agents: long investigations, debugging sessions, audits, multi-agent searches, systematic explorations, planning with many interdependent constraints…
design
Use for UI, UX, visual hierarchy, frontend-design judgment, references, redesigns, and design critique when the user's Emulo taste should guide the task. Do not use for unrelated execution or marketing/social writing alone.
frontend-design
Create distinctive, production-grade frontend interfaces.
causal-memory
Causal memory for agents — install/setup the causal-memory MCP server, then record decisions/outcomes and recall them before acting. Trigger when the user asks to install or set up causal-memory/agent memory, when causal-memory MCP tools are available and the agent faces a non-trivial decision (architecture, debugging…
frontend
Two-mode frontend skill: (1) authoring — accessibility, responsive layout, loading/error states, performance, DESIGN.md authoring, visual direction; (2) critique — READ-only scored review of built UI against anchored rubric, AI-slop detection, two isolated assessments. Router invokes mode via context.