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 memi-design/design-skills --skill memoire-design-toolinggit clone --depth 1 https://github.com/memi-design/design-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/memi-design/design-skills/memoire-design-tooling)<a href="https://agentmods.dev/skills/memi-design/design-skills/memoire-design-tooling"><img src="https://agentmods.dev/badge/skills/memi-design/design-skills/memoire-design-tooling/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/memi-design/design-skills/memoire-design-tooling"><img src="https://agentmods.dev/badge/skills/memi-design/design-skills/memoire-design-tooling.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.00057 | $0.01273 |
| Opus 5 | $0.00028 | $0.00636 |
| Sonnet 5 | $0.00011 | $0.00255 |
| Haiku 4.5 | $0.00006 | $0.00127 |
Grade A, and why
memoire-design-tooling 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 9d 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 — 112 lines — stays where its author put it; the contents beside it link to each section on GitHub.
memi Design Tooling
Use memi as the local interface-understanding layer before broad frontend changes. The goal is to give the agent evidence about the product UI before it edits code.
Fast Path
npm i -g @memi-design/cli
memi suite init --project .
memi daemon start --project . --port auto
memi daemon status --json
memi agent install --dry-run --json
memi agent brief . --intent "Improve this interface" --json
memi status
memi diagnose .
memi ux audit . --json
memi craft audit . --json
memi tokens --from ./src --report
memi shadcn export --out public/r
memi mcp start --no-figma
Interface Understanding Protocol
- Read the local instructions first:
AGENTS.md, README files,.memoire/, specs, tokens, andmemoire.agent.yaml. - Generate a design-agent preflight with
memi agent brief . --intent "<task>" --json; use it as the local evidence and cost-control contract. - Collect evidence with
memi diagnose .,memi ux audit . --json,memi craft audit . --json, andmemi tokens --from ./src --reportbefore making broad UI edits. - If a runtime route matters, run
memi diagnose http://localhost:<port>ormemi design-doc <url> --spec. - If Figma is connected, use memi/Figma context for token pulls, component inspection, screenshot capture, and sync. Figma is optional; do not block code-first audits on it.
- Map components to Atomic Design levels: atom, molecule, organism, template, page.
- Prefer shadcn/ui primitives and Tailwind. Avoid introducing CSS modules or styled-components for memi-generated UI.
- Use UX Tenets and Traps as the review layer: clarity, feedback, control, consistency, accessibility, error recovery, progressive disclosure, workflow fit, trust, and state continuity.
- Use Interface Craft as the polish layer: focusing mechanism, visual hierarchy, spacing rhythm, color intentionality, visual weight, component cohesion, responsive resilience, and user context.
- For research-backed product work, run the research flow before implementation:
What ships with it
1 file 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.
- 9d ago First seen · 112 lines · 57 tokens per session scan A d5ae3f129474
memoire-design-tooling is a skill published in the GitHub repository memi-design/design-skills (7 stars, last pushed 1mo ago), licensed MIT. It adds 57 tokens to every session and 1,273 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 skills, from other repositories
accessibility
Use when making a web UI conform to WCAG 2.2 Level AA — axe-core or Lighthouse a11y violations, keyboard operability, focus management, ARIA roles/names/live regions, contrast, tap-target size. NOT palette or visual intent (that is design), NOT test-runner setup (that is testing-web), NOT LCP/page-speed (that is…
motion-craft
Use when an interface moves and the movement has to feel right — durations and easing, what must never animate, fixing motion that reads sluggish, cheap or janky, and reduced-motion. Web and native. NOT the visual system (that is design), NOT the graded critique (that is design-loop).
design-engineering
Premium design engineering skill for agentic workflows — produces high-end, distinctive UI designs using DESIGN.md as the portable contract across Pencil MCP (in-IDE canvas), Figma MCP (team handoff + design tokens), and Google Stitch (vibe exploration + AI generation). Enforces anti-generic principles, WCAG 2.2 AA…
motion-guide
Use when designing, adding, changing, suggesting, or reviewing UI motion. Motion Guide is a default-trigger motion decision advisor for AI coding agents: it decides whether motion should exist, selects an appropriate functional or expressive pattern, and constrains implementation with timing, easing, accessibility…
motion
Author verified, reduced-motion-safe web animation with MotionSpec. Use when adding scroll, entrance, hover, or loop animation to a website or web app — instead of hand-writing GSAP or CSS keyframes, write a MotionSpec JSON spec, validate it, and compile deterministic code.
canon-interaction
Use when designing or auditing interactive states (hover, focus, active, disabled, loading), focus management, keyboard navigation, click targets, drag-and-drop, or any user input handling. Trigger when the user mentions states, focus, hover, keyboard, interaction, click, tap, or fixing how something responds.