Design, refine or critique web UI, landing pages, decks and image sets so they read as chosen, not generated. Use for a new page, a redesign, a design review, polish, motion or a brief.
Collected from public GitHub. Every version is saved exactly as it was and never changes. Install it at an exact version with the mdr tool, and every file is checked before it reaches your agent. The main file is checked against the SHA-256 fingerprint recorded here, and the others against the fingerprints GitHub keeps for its source commit. The automatic checks below grade the latest version, and the same checks always give the same file the same grade.
What the file says
# Design
Make interfaces that read as chosen, not generated. Every default is a decision someone skipped. This skill makes each decision on purpose: a brief first, a build to a quality floor, then a critique of real screenshots.
Two failure modes, and the first is worse:
1. **Generic.** The page could belong to any product in its category. It wears the current AI defaults, or it is so plain that nobody remembers it.
2. **Noisy.** Every element performs. Motion, gradients and ornament compete, and nothing reads first.
The cure for both is one strong idea, expressed in one place, inside a disciplined system. Restraint is not the goal. Intention is.
## 1. Pick the mode
| Mode | Use it when | Do |
|------|-------------|----|
| **Build** | A new page, screen, component, deck or image set | Sections 2 to 5 |
| **Refine** | "Make it bolder, quieter, simpler, more colorful, more alive" | Section 6 |
| **Critique** | "Review this", "does this look right", a score | [references/critique.md](references/critique.md) |
| **Polish** | Before you ship anything visual | Section 7 |
…
The line at the top of this page pins the label git:20261020.e62e64e, which is what most people want. This one pins the sha256 fingerprint of the contents instead, so it survives a label being moved. Either way the exact version is written to mdr.lock, and mdr install downloads and checks those contents again, so it installs them exactly or stops with an error.
GET https://markdownregistry.com/api/v1/artifacts/art_orqtwjtgam2evey5
GET https://markdownregistry.com/api/v1/resolve?ref=imagile-dev/claude-plugins/design
GET https://markdownregistry.com/api/v1/blob/f2496d2bd134addcb32a17fdd5962346eb55c6cc365d3db6e250d2d635b5378a
Your AI assistant does the legwork. You hear about the deals worth your word. Hand yours the standing instructions at modelranch.com and it joins the network that reads files like this one.
imagile-dev/claude-plugins · plugins/imagile/skills/accessibility/SKILL.md · Audit a site or app for WCAG 2.2 AA with axe-core across widths, color schemes and themes, then guide fixes. Use for…
imagile-dev/claude-plugins · plugins/imagile/skills/architecture/SKILL.md · Design or review a system with Imagile's opinions on .NET, Blazor, TypeScript, Astro and Azure. Use for structure…
imagile-dev/claude-plugins · plugins/imagile/skills/background-removal/SKILL.md · Remove image backgrounds offline with Python and rembg, for one file or a folder. Use for cutouts, transparent PNGs or…
imagile-dev/claude-plugins · plugins/imagile/skills/code-review/SKILL.md · Review a diff or PR with a clear Approve or Request Changes and short Major, Minor and Nit findings. Use when asked to…
imagile-dev/claude-plugins · plugins/imagile/skills/commit/SKILL.md · Write a Conventional Commit for the staged changes and commit them. Use when asked to commit, or to write a commit…
imagile-dev/claude-plugins · plugins/imagile/skills/image-generation/SKILL.md · Generate or edit images through the ChatGPT website in a browser, falling back to the OpenAI Images API. Use for logos…
imagile-dev/claude-plugins · plugins/imagile/skills/plan/SKILL.md · Scope engineering work as a GitHub issue and a vertical-slice plan. Use for "plan X", "scope Y", "break this down", or…
imagile-dev/claude-plugins · plugins/imagile/skills/principles/SKILL.md · Write, sharpen and audit a principle-first CLAUDE.md so agents decide without asking. Use to set up CLAUDE.md, turn a…
imagile-dev/claude-plugins · plugins/imagile/skills/revisit/SKILL.md · Review the decisions agents logged in AGENT_DECISIONS.md in one batch, then keep, promote to a principle, or reverse…
imagile-dev/claude-plugins · plugins/imagile/skills/ship/SKILL.md · Take a branch to a merged PR. Rebase, run parallel reviewer agents, fix every finding, log principle gaps, open the PR…
jeremylongshore/tons-of-skills-marketplace · plugins/ai-agency/hyperflow/skills/design/SKILL.md · Use when the user wants the visual/experiential design of a product done systematically — a design system, a screen, a…
sethgammon/citadel · skills/design/SKILL.md · Generates and maintains a design manifest for visual consistency. In existing projects, reads current styles and…
ericrisco/rsc-harness · skills/design/SKILL.md · Use when designing, redesigning, restyling or reviewing a web page or app screen (landing, product site, portfolio…
adityaraj0421/naksha-studio · skills/design/SKILL.md · Assembles a virtual design team to produce production-quality UI, UX, visual, social media, email, and data output. A…
firecrawl/firecrawl-claude-plugin · skills/design/SKILL.md · Extract a reference website's design system into DESIGN.md with tokens, layout, components, and imagery. Use for…