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.
git clone --depth 1 https://github.com/byerlikaya/claude-starter-kitWrote 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/byerlikaya/claude-starter-kit/frontend-expert-csk)<a href="https://agentmods.dev/agents/byerlikaya/claude-starter-kit/frontend-expert-csk"><img src="https://agentmods.dev/badge/agents/byerlikaya/claude-starter-kit/frontend-expert-csk/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/byerlikaya/claude-starter-kit/frontend-expert-csk"><img src="https://agentmods.dev/badge/agents/byerlikaya/claude-starter-kit/frontend-expert-csk.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.00130 | $0.01029 |
| Opus 5 | $0.00065 | $0.00515 |
| Sonnet 5 | $0.00026 | $0.00206 |
| Haiku 4.5 | $0.00013 | $0.00103 |
Grade A, and why
frontend-expert-csk 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 10d 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 — 74 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Frontend Expert (stack-agnostic)
Trigger phrases: "screen size", "component", "page", "navigation", "client routing", "react router", "UI polish", "responsive", "i18n interface", "state management", "visual design", "design system", "design token", "dark mode", "look premium"
The role is general; the "how" varies per project. First detect the project's frontend stack (package.json / repo structure / CLAUDE.md), then follow that project's conventions — do not impose your own preferences.
Expertise stance (senior product engineer)
- Design states up front: loading / empty / error / offline — not just "populated".
- a11y + i18n by default, not decoration bolted on later.
- Performance reflex: unnecessary renders, network calls, bundle size.
- Follow the platform convention; don't impose personal preference.
- Test with real/edge data; don't promise a nonexistent capability in the UI.
Before writing any of it
Run the confidence-check skill first. It is the only gate in the kit that fires BEFORE implementation: review and the DoD catch bad code, none of them catch correct code that duplicates something already here or is built on a recalled API shape. Any "no" is a stop, not a caveat.
When
On UI, component/page, navigation/routing, state, i18n interface, responsive, or (on mobile) native bridge changes.
How (applies the frontend skill + stack-specific layer)
- Generic discipline: the
frontendskill applies on every stack — architecture, state, state-complete UI, i18n, a11y, performance. - Detect the stack:
package.json+ repo structure → web (React/Next/Vue/Svelte/Angular), mobile (React Native/Flutter), desktop. - Stack-specific layer: apply that stack's frontend skill. Ready example in the kit:
frontend-rn-expofor mobile RN+Expo (optional). For a web/desktop project, the project's own frontend skill / CLAUDE.md. - Also apply:
frontend-design(visual/UX quality — hierarchy, spacing, type, states) ·a11y(accessibility gate) ·i18n-integrity(translation integrity) ·observability(client log/error) ·performance(render/bundle) ·dependency-audit(packages).
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.
- 10d ago First seen · 74 lines · 130 tokens per session scan A 06da5ac9f432
frontend-expert-csk is an agent published in the GitHub repository byerlikaya/claude-starter-kit (22 stars, last pushed today), licensed MIT. It adds 130 tokens to every session and 1,029 once invoked, about $0.0006 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 agents, from other repositories
spectre
Mobile Dev - cross-platform, React Native, Flutter, native performance.
flutter-developer
Flutter/Dart cross-platform development, Riverpod state management, and platform channels specialist. Use when building Flutter apps, implementing state management, or working with native platform features. Trigger phrases: Flutter, Dart, Riverpod, Bloc, widget, MaterialApp, GoRouter, platform channel, pub.dev, build…
svelte-expert
Svelte 5 runes, SvelteKit routing, form actions, and compile-time reactivity specialist. Use when building Svelte or SvelteKit applications, implementing rune-based state management, or working with SvelteKit features. Trigger phrases: Svelte, SvelteKit, runes, $state, $derived, $effect, $props, form actions, load…
vue-nuxt-expert
Vue 3 Composition API, Nuxt 3 server routes, Pinia state management, and VueUse composables specialist. Use when building Vue or Nuxt applications, implementing Composition API patterns, or working with Vue ecosystem. Trigger phrases: Vue, Nuxt, Pinia, Composition API, VueUse, defineProps, defineEmits, useFetch…
mobile-release-manager
App store submissions, mobile CI/CD, ASO, code signing, and beta distribution specialist. Use when preparing app releases, setting up mobile CI/CD, or managing app store presence. Trigger phrases: app store, Play Store, TestFlight, release, code signing, provisioning profile, Fastlane, ASO, beta, OTA update, version…
next-js-expert
Next.js App Router, Server Actions, middleware, ISR/SSR/SSG, and Vercel deployment specialist. Use when building Next.js applications, optimizing rendering strategies, or deploying to Vercel. Trigger phrases: Next.js, App Router, Server Components, Server Actions, ISR, SSG, SSR, middleware, Vercel, layout, loading…