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 skills add AleksandarBisevac/claude-plugins --skill writing-cssgit clone --depth 1 https://github.com/AleksandarBisevac/claude-pluginsWrote 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/aleksandarbisevac/claude-plugins/writing-css)<a href="https://agentmods.dev/skills/aleksandarbisevac/claude-plugins/writing-css"><img src="https://agentmods.dev/badge/skills/aleksandarbisevac/claude-plugins/writing-css/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/aleksandarbisevac/claude-plugins/writing-css"><img src="https://agentmods.dev/badge/skills/aleksandarbisevac/claude-plugins/writing-css.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.00167 | $0.01912 |
| Opus 5.5 | $0.00067 | $0.00765 |
| Sonnet 5.5 | $0.00033 | $0.00382 |
| Haiku 4.5 | $0.00017 | $0.00191 |
Grade A, and why
writing-css 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 — 114 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Writing CSS here
Two stylesheets, ~2,000 lines, concatenated by Python after a generated token layer into one
inline <style>. Neither is valid alone — both reference custom properties they do not declare,
and panel.css on its own fails the color-scheme check. Assembly, splitting and the byte pins
belong to refactoring-the-assembled-ui; this is how you write a rule.
Tokens are the language
_ui_theme.py declares 78 custom properties on :root (58 of them user-themable) and
prepends them to both sheets. The discipline is already strong — panel.css uses var(--…) 605
times against 13 raw hex literals, report.css 429 against 8 — and it is the thing to protect.
- Never write a raw colour. If a role does not exist, add the token; do not inline a hex.
- The spacing migration is half done, so finish it rather than widening it.
--sp-0…--sp-7exist and are used throughout the usage sections, yet.5rem,.25rem,.75rem,1remand1.5remare still written raw 204 times elsewhere — and each of those five has an exact token. Use the token. - Type has a four-step scale and the sheets contain about 23 distinct font-size literals. Pick a step; add one if the design genuinely needs it.
- A metric both surfaces use is a token, or it will drift. It already has:
.shellismax-width:92remin the panel and96remin the report,.bud's grid disagrees in four places, the nav breakpoint is70remagainst72rem,.triis.9emagainst1em. - Adding a token has obligations.
compile_theme(DEFAULT_THEME) == TOKEN_CSSis pinned byte-for-byte, so no comment insideTOKEN_CSSmay contain a brace, and a new token must be placed in a theme group or the neutral list or the round-trip case fails.
Modern syntax that is safe here
Check the feature before using it — grep '^| container-queries ' in
refactoring-the-assembled-ui/references/baseline-snapshot.md. As of the 2026-07-08 snapshot:
- Widely available, use freely: cascade layers (
@layer), container queries (@container),:has(), nesting,:where()/:is(). - Newly available, needs
@supportsplus a fallback:light-dark(), view transitions. - Limited, do not use: anchor positioning.
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 Changed afe7f2719417
- 1mo ago First seen · 114 lines · 167 tokens per session scan A e76070101c23
writing-css is a skill published in the GitHub repository AleksandarBisevac/claude-plugins (4 stars, last pushed yesterday), licensed MIT. It adds 167 tokens to every session and 1,912 once invoked, about $0.0007 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 skills, from other repositories
prism-audit
Frontend audit — bundle size, dependencies, accessibility, performance, component quality. Use when asked for "frontend review", "performance audit", "accessibility check", or "bundle size".
touch-audit
Mobile audit — app size, startup time, crash reporting, store compliance, accessibility, offline behavior. Use when asked for "mobile review", "app store readiness", "mobile performance", or "crash analysis".
forge-audit
Audit existing infrastructure for security issues, waste, and misconfigurations. Use when asked to "audit my infra", "check cloud setup", "infra review", "are we wasting money", "security check on infra", or "review my terraform".
lens-audit
Review existing analytics — find all dashboards and reports, check who uses them, whether metrics are defined, and whether they drive decisions. Recommend what to keep, kill, or add. Use when asked "are our dashboards useful", "analytics review", or "metrics audit".
warden-audit
Full security audit — secrets, dependencies, IAM, auth, injection, XSS, HTTPS, rate limiting, public storage. Use when asked for "security audit", "check for vulnerabilities", "security review", or "are we secure".
relay-audit
Audit an existing CI/CD pipeline for slowness, security issues, and reliability gaps. Use when asked to "audit pipeline", "why is CI slow", "pipeline review", or "deployment review".