fat-design

fat-design is a skill for Claude Code from spruikco/fat-agent-skill. It costs 237 tokens per session (2,353 once invoked), scanned A, original, MIT.

A design review method for screens, websites, screenshots, mockups, or frontend code. It checks product design, writing, typography, visual craft, interaction, and animation to find weak details.

In plain words
What is it for?
Use it to audit a live site, component, screen, or mockup and produce ranked findings and briefs for the most important fixes.
Why use it?
It helps identify the small interface decisions that make a screen confusing or unfinished, instead of treating the first working version as complete.

Skill for Claude Code

Written for Claude Code: ${CLAUDE_PLUGIN_ROOT} variable.

Runs only inside its plugin — its command needs a path that Claude Code sets for a plugin’s own hooks and for nothing else. Install the plugin, not this.

Part of the fat-agent plugin — 2 skills, 3 commands shipped together

Good fit Use it to audit a live site, component, screen, or mockup and produce ranked findings and briefs for the most important fixes.

Compare 6 skills from other repositories ↓
Install

Getting it into your agent

This one installs as part of its plugin. Adding the marketplace and installing the plugin brings it with everything else the plugin ships.

Claude Code
/plugin marketplace add spruikco/fat-agent-skill
Claude Code
/plugin install fat-agent

Made for: Claude Code.

Or install fat-agent, the plugin that ships this one along with the rest of its 2 skills, 3 commands.

Wrote 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.

agentmods badge for fat-design

README.md
[![agentmods](https://agentmods.dev/badge/skills/spruikco/fat-agent-skill/fat-design/github.svg)](https://agentmods.dev/skills/spruikco/fat-agent-skill/fat-design)
Your own site
<a href="https://agentmods.dev/skills/spruikco/fat-agent-skill/fat-design"><img src="https://agentmods.dev/badge/skills/spruikco/fat-agent-skill/fat-design/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.

agentmods 80×15 button for fat-design

Your own site · 80×15
<a href="https://agentmods.dev/skills/spruikco/fat-agent-skill/fat-design"><img src="https://agentmods.dev/badge/skills/spruikco/fat-agent-skill/fat-design.svg" alt="Reviewed on agentmods" width="80" height="20"></a>
Per session 237 Skills are progressive disclosure: only the name and description are preloaded; the body loads when the skill is used.
When invoked 2,353 The whole file, excluding the scripts and references it only reads on demand.
Security scan A 0 findings. A grade says what 26 rules found in the file — not that it is safe.
Origin original No closer match found in the catalogue.
Token cost

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.

ModelPer sessionOnce invoked
Fable 5.1 $0.00237 $0.02353
Opus 5.5 $0.00095 $0.00941
Sonnet 5.5 $0.00047 $0.00471
Haiku 4.5 $0.00024 $0.00235

Measured 17d ago against content hash c522c41d22d3, method: parsed. Prices are Anthropic first-party input rates as of 2026-10-07, from the pricing page.

Security

Grade A, and why

fat-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 17d 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.

plugins/fat-agent/skills/fat-design/SKILL.md · 183 lines

How it starts

The opening of the file, as written. The whole thing — 183 lines — stays where its author put it; the contents beside it link to each section on GitHub.

FAT Design: the last 10% audit

AI gets an interface about 90% of the way there. FAT Design audits and fixes the last 10%: the small decisions that make a screen feel considered rather than assembled from defaults. It is the design department of FAT Agent and pairs with the fat-agent skill, which owns SEO, security, performance and accessibility-as-code. Run both on a live site; run FAT Design alone on a screen, a component or a mockup.

Method informed by Matthew Blode's Taste Training course (blode.co/taste-training). The per-lens checklists in references/design/ are the working notes; the course is the depth behind them.

House rule: never use em dashes in anything you write for this audit. The method flags more than one em dash per 1,000 words as a tell of generated copy, so the audit's own prose cannot carry them. Use commas, full stops or brackets.

The core idea

"The quality of any collaborative creative endeavour tends to approach the level of taste of whoever is in charge." When you brief an AI or a builder, you are in charge, so your taste is the ceiling.

Quality is a stack of small decisions pointing at one task. None alone is the polish. Taste is trained, not innate: you build it by comparing versions, naming the difference, then testing that principle elsewhere. The whole game is one loop:

Spot -> Name -> Fix -> Verify. Feel what is off, name it in a lens's vocabulary (so it becomes something you can hunt on purpose, not a lucky catch), ask for the stronger version, then prove the repair on the task that exposed it.

When to run it

  • A live URL (screenshot it in the browser, or read the rendered DOM and CSS).
  • A screenshot or mockup the user drops in.
  • Local frontend code (React, HTML, CSS) in a repo.
  • Right after a generator or agent produces a screen, or after a deploy, as a ship/no-ship quality gate.

If the target is a whole live site and the user also wants SEO, security or speed, run the fat-agent skill (or /fat-audit) for those and FAT Design for design quality. They are complements, and findings from both belong on the same punch list.

Read the full file on GitHub · 183 lines

Changes

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.

  1. 17d ago First seen · 183 lines · 237 tokens per session scan A c522c41d22d3

Subscribe to this mod's changes

fat-design is a skill published in the GitHub repository spruikco/fat-agent-skill (40 stars, last pushed 7d ago), licensed MIT. It adds 237 tokens to every session and 2,353 once invoked, about $0.0009 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-10-21.

Related

fat-design compared with skills from other repositories

fat-design next to 6 skills from other repositories
ModTypeStarsLast pushLicenceScanTokensWorks with
fat-designspruikco/fat-agent-skillSkill407d agoMITA237Claude Code
webgl-holographic-foilnexu-io/open-designSkill106kyesterdayApache-2.0A41Claude Code, Codex
html-ppt-hermes-cyber-terminalnexu-io/open-designSkill106kyesterdayApache-2.0A53Claude Code, Codex
html-ppt-taste-brutalistnexu-io/open-designSkill106kyesterdayApache-2.0A78Claude Code, Codex
visual-ralphYeachan-Heo/oh-my-codexSkill34k3d agoMITA52Codex
glance-canonical-layoutsandroid/skillsSkill10kyesterdayApache-2.0A56Claude Code
accessibilitymicrosoft/hve-coreSkill1.6kyesterdayMITA47Claude Code