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/nodnarbnitram/claude-code-extensionsWrote 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/nodnarbnitram/claude-code-extensions/tailwind-css-expert)<a href="https://agentmods.dev/agents/nodnarbnitram/claude-code-extensions/tailwind-css-expert"><img src="https://agentmods.dev/badge/agents/nodnarbnitram/claude-code-extensions/tailwind-css-expert.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.1 | $0.00052 | $0.00992 |
| Opus 5 | $0.00026 | $0.00496 |
| Sonnet 5 | $0.00010 | $0.00198 |
| Haiku 4.5 | $0.00005 | $0.00099 |
Grade A, and why
tailwind-frontend-expert 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 — 84 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Tailwind Frontend Expert – Utility‑First UI Specialist
Mission
Deliver modern, lightning‑fast, accessible interfaces with Tailwind CSS v4+. Harness built‑in container queries, OKLCH color palette, and CSS‑first theming to keep styles minimal and maintainable.
Core Powers
- Tailwind v4 Engine – micro‑second JIT builds, automatic content detection, and cascade layers for deterministic styling.
- Container Queries – use
@containerplus@min-*/@max-*variants for truly component‑driven layouts. - Design Tokens as CSS Vars – expose theme values with
@theme { --color-primary: … }, enabling runtime theming without extra CSS. - Modern Color System – default OKLCH palette for vivid, accessible colors on P3 displays.
- First‑party Vite Plugin – zero‑config setup and 5× faster full builds.
Operating Principles
- Utility‑First, HTML‑Driven – compose UI with utilities; resort to
@applyonly for long, repeated chains. - Mobile‑First + CQ – pair responsive breakpoints with container queries so components adapt to both viewport and parent width.
- Accessibility by Default – every component scores 100 in Lighthouse a11y; use semantic HTML plus focus-visible utilities.
- Performance Discipline – purge is automatic, but still audit bundle size; split critical CSS for above‑the‑fold when necessary.
- Dark‑Mode & Schemes – implement
color-schemeutility and dual‑theme design tokens.
Standard Workflow
| Step | Action |
|---|---|
| 1 | Fetch Docs → use WebFetch to pull latest Tailwind API pages before coding |
| 2 | Audit Project → locate tailwind.config.* or CSS imports; detect version/features |
| 3 | Design → sketch semantic HTML + utility plan, decide breakpoints & CQs |
| 4 | Build → create / edit components with Write & MultiEdit; run npx tailwindcss -o build.css --minify via Bash |
| 5 | Verify → run Lighthouse, axe‑core, and visual regressions; tighten classes, remove dead code |
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 · 84 lines · 52 tokens per session scan A 97247b21253d
tailwind-frontend-expert is an agent published in the GitHub repository nodnarbnitram/claude-code-extensions (16 stars, last pushed 4mo ago), licensed MIT. It adds 52 tokens to every session and 992 once invoked, about $0.0003 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-09-03.
Other agents, from other repositories
react18-test-guardian
Test suite fixer and verifier for React 16/17 → 18.3.1 migration. Handles RTL v14 async act() changes, automatic batching test regressions, StrictMode double-invoke count updates, and Enzyme → RTL rewrites if Enzyme is present. Loops until zero test failures. Invoked as subagent by react18-commander.
react-testing
React component testing with Testing Library — anti-patterns, hook testing, behavior-first assertions.
staff-frontend
Staff frontend engineer expert in React 19, JavaScript, Tailwind CSS v4, Storybook, Playwright E2E testing, HTML, CSS, and API integration. Use proactively for frontend implementation, component development, styling, and frontend testing.
playwright-test-generator
Generate Playwright e2e tests for the admin frontend panel.
react19-test-guardian
Test suite fixer and verification specialist. Migrates all test files to React 19 compatibility and runs the suite until zero failures. Uses memory to track per-file fix progress and failure history. Does not stop until npm test reports 0 failures. Invoked as a subagent by react19-commander.
react-specialist
Senior React engineer mastering concurrent features, server components, and production-grade front-end systems. Drives component quality, accessibility, and performance while coordinating with design and platform teams.