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 sergeyizmailov/knowledge-delta-skills --skill design-stack-pickergit clone --depth 1 https://github.com/sergeyizmailov/knowledge-delta-skillsWrote 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/sergeyizmailov/knowledge-delta-skills/design-stack-picker)<a href="https://agentmods.dev/skills/sergeyizmailov/knowledge-delta-skills/design-stack-picker"><img src="https://agentmods.dev/badge/skills/sergeyizmailov/knowledge-delta-skills/design-stack-picker/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/sergeyizmailov/knowledge-delta-skills/design-stack-picker"><img src="https://agentmods.dev/badge/skills/sergeyizmailov/knowledge-delta-skills/design-stack-picker.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.00063 | $0.00854 |
| Opus 5.5 | $0.00025 | $0.00342 |
| Sonnet 5.5 | $0.00013 | $0.00171 |
| Haiku 4.5 | $0.00006 | $0.00085 |
Grade A, and why
design-stack-picker 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 — 71 lines — stays where its author put it; the contents beside it link to each section on GitHub.
design-stack-picker
A selection layer, not a mandate to replace the project's design system.
Decision order
Audit first: framework and rendering model, existing icons/fonts/tokens/components/image pipeline/breakpoints, current dependencies, visual style. Then:
- Reuse the existing project system if it works.
- Extend it with the smallest compatible building block.
- Add a library only when there is no good local solution.
- Hand-craft only for brand assets, tiny static pieces, or where a dependency outweighs the implementation.
Defaults
Starting points, not requirements.
| Axis | Default |
|---|---|
| Icons | Iconify + Solar; Simple Icons for brand marks |
| Fonts | Unbounded display + Onest body via Fontsource |
| Components | Project components first; HyperUI/Preline for static sections; shadcn/Radix for React primitives |
| Color | Semantic CSS variables; one dominant brand color + one accent |
| Motion | CSS-first restrained reveal; Motion for React; GSAP only for complex timelines |
| Imagery | Real product/user/stock/CMS assets; AVIF/WebP where practical |
Dependency budget
No dependency for: a single icon when an icon system exists; one static section existing primitives can handle; a basic disclosure/dropdown in Astro or plain HTML where scoped JS is smaller and verifiable; a visual effect existing CSS covers; anything duplicating a current dependency.
Add one when it removes real implementation risk: complex accessible widgets, broad consistent icon coverage, image optimization at scale, multi-screen design systems.
Context routing
| Context | Bias |
|---|---|
| Astro/static | Local .astro components, scoped CSS, progressive JS, astro:assets; avoid React-only primitives unless already used |
| React/Next | Current UI layer first; shadcn/Radix for missing complex primitives |
| Admin/dashboard | Dense scannable forms/tables/filters, minimal decoration |
| Ecommerce | Real product photos, neutral placeholders, stable card dimensions with object-fit: contain; price/stock/spec/action hierarchy over decorative labels; reachable category nav, autocomplete, dismissible mobile filters; test long names, missing images, sale/stock states, uneven counts |
| Marketing | Stronger typography, imagery/video, section blocks, restrained motion |
| Prototype | Smallest working choice; no full design system unless it will continue |
What ships with it
2 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.
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 First seen · 71 lines · 63 tokens per session scan A fe389f73b7f7
design-stack-picker is a skill published in the GitHub repository sergeyizmailov/knowledge-delta-skills (3 stars, last pushed 1mo ago), licensed MIT. It adds 63 tokens to every session and 854 once invoked, about $0.0003 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
fastapi_stripe
A Stripe Checkout implementation takes four steps.
pn-cx-agent-patterns
Design and build customer-facing AI agents — concierge-style service agents, agentic commerce flows (session memory, preference recall, multi-turn negotiation, delegated transaction execution), and hyper-personalized CX pipelines. Use when building customer support agents, shopping assistants, booking agents, or any…
pn-payment-integration
Stripe, PayPal, Square integration. Checkout, subscriptions, webhooks, PCI compliance. Use when implementing payments, billing, or subscription features.
product-price-monitor
Watch product, flight, or listing prices; alert on target.
nft-standards
Implement NFT standards (ERC-721, ERC-1155) with proper metadata handling, minting strategies, and marketplace integration. Use when creating NFT contracts, building NFT marketplaces, or implementing digital asset systems.
pricing-page-generator
Deprecated compatibility entry for Pricing Page construction. This page is now maintained in Pagina; install and use page-builder to build a new Pricing Page.