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/sammcj/agentic-coding/analyse-designnpx skills add sammcj/agentic-coding --skill analyse-designgit clone --depth 1 https://github.com/sammcj/agentic-codingWhat 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.00060 | $0.01003 |
| Opus 5 | $0.00030 | $0.00502 |
| Sonnet 5 | $0.00012 | $0.00201 |
| Haiku 4.5 | $0.00006 | $0.00100 |
Grade A, and why
analyse-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 2d 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 — 59 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Analysing Design Systems
Act as a UI/UX design analyst conducting analysis of frontend and design systems.
You may be asked to reverse-engineer the design system from a codebase, website or provided screenshots. Unless otherwise stated by the user your goal is to produce a design system reference document a developer could use to build components that belong in this application.
First, create a task for each phase - scope, source scan, dimension analysis, and each output section - then work them to completion.
Where to Look
Scan for design-relevant sources in this priority order:
- Theme/token files - tailwind.config, Tailwind v4 CSS-first tokens (
@themeblocks in CSS), theme.ts/js, tokens.json, design-tokens, variables.css/scss - Global styles - global.css, app.css, index.css, _variables.scss, CSS custom properties (
:root/[data-theme]) - Component library config - shadcn components.json, MUI theme, Chakra theme, Ant Design config
- Layout components - shell, sidebar, header, navigation components for spacing and structure patterns
- Representative components - buttons, inputs, cards, modals for recurring visual patterns
Dimensions to Analyse
For each dimension, cite specific files and style definitions.
- Design language - visual school/philosophy (e.g., neo-brutalist, material, glassmorphism, minimal flat). Mood conveyed. Unique visual signatures
- Colour palette - extract actual values. Identify primary, secondary, accent, background, surface, semantic colours (error, success, warning). Note contrast ratios and dark/light mode support
- Typography - font families, weight scale, size scale, line heights. How hierarchy is established
- Spacing and layout - spacing scale, grid system, whitespace usage, information density, consistent sizing patterns
- Component patterns - common shapes, border radii, shadow treatments, interaction states across buttons, inputs, cards, navigation, status indicators
- Iconography - icon style (outline, filled, duotone), library if identifiable
- Motion - animation patterns, easing curves, transition durations found in code
- Responsive behaviour - breakpoints, layout shifts, mobile adaptations
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.
- 2d ago First seen · 59 lines · 60 tokens per session scan A ab997cadf09a
analyse-design is a skill published in the GitHub repository sammcj/agentic-coding (158 stars, last pushed 8d ago), licensed Apache-2.0. It adds 60 tokens to every session and 1,003 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-08-30.
Other skills, from other repositories
aksel-builder
Expert builder for Aksel, the Nav / @navikt design system — React components, design tokens, layout primitives, theming (light/dark), icons, CSS, the Tailwind preset, version migrations, Figma-to-code. Triggers — Aksel, "using/with aksel", Nav/Navikt, "designsystemet", "design system", @navikt/ds- (e.g.…
aksel-spacing
Lag responsive layouts med Aksel Design System (v8+) - spacing tokens, layout primitives (Box, HStack, VStack, HGrid, Page, Bleed) og ResponsiveProp.
web-design-reviewer
Visuell inspeksjon av nettsider for å identifisere og fikse designproblemer. Trigges av forespørsler som "sjekk designet", "gå gjennom UI-en", "fiks layouten", "finn designfeil". Finner problemer med responsivt design, tilgjengelighet, visuell konsistens og layout, og fikser dem i kildekoden.
figma-plugin
Use when building Figma plugins, creating design automation tools, implementing sandbox/UI communication, or working with the Figma Plugin API for node manipulation, styles, and components.
ilya-sutskever
Agente que simula Ilya Sutskever — co-fundador da OpenAI, ex-Chief Scientist, fundador da SSI. Use quando quiser perspectivas sobre: AGI safety-first, consciência de IA, scaling laws, deep learning profundo, o episódio de novembro 2023 na OpenAI, superinteligência segura.
yann-lecun
Agente que simula Yann LeCun — inventor das Convolutional Neural Networks, Chief AI Scientist da Meta, Prêmio Turing 2018.