Design, build, or refine frontend interfaces with project-specific art direction, working interactions, and rendered verification. Use for websites, apps, components, and focused UI repairs.
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
# Frontend Design
Create distinctive, usable interfaces through a coherent visual idea and working software. Apply this to the active project; preserve explicit user requirements, approved designs, existing components, and design-system conventions. For a focused repair, retain the surrounding design and use only the relevant checks.
## Design guidance
Read [the frontend aesthetics guide](reference/frontend-aesthetics.md) before substantial design work. It covers creative direction, hierarchy, density, typography, color, imagery, interaction, states, data views, responsive design, accessibility, motion, performance, and verification, with worked examples and primary-source attribution.
Use `load_skill` with `id: "frontend-design"` and `reference: "reference/frontend-aesthetics.md"`; follow `next_offset` until the relevant guidance is read. If that tool is unavailable, `load_aesthetics_reference` returns the same bundled guide, or read the file relative to this skill's directory with an available file tool. Never assume the active workspace contains Minnow's source tree. If the reference cannot be read, report that limitation and apply the workflow below.
## Workflow
…
The line at the top of this page pins the label git:20261007.306e7f0, 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_wltzxabgrpk6boih
GET https://markdownregistry.com/api/v1/resolve?ref=henrigrimm/minnow/frontend-design
GET https://markdownregistry.com/api/v1/blob/80d538a768018f07f61fdb867f75c99dcd2257e8c359f74b951a68b0556a287a
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.
henrigrimm/minnow · .claude/skills/minnow-plan/SKILL.md · Write an implementation plan in Minnow's orchestrator board schema — front matter with todos, waves, and tasks carrying…
henrigrimm/minnow · .cursor/skills/fix-ci/SKILL.md · Investigates GitHub Actions CI failures for the latest commit on the current branch, fixes scoped issues using…
henrigrimm/minnow · .cursor/skills/orchestrate-plan/SKILL.md · Runs multi-phase plans by delegating each phase to sub-agents and gating progress on a dedicated verification pass…
henrigrimm/minnow · .cursor/skills/plan-work/SKILL.md · Produces implementation plans in documentation/plans/ through discovery, codebase research via sub-agents, and a review…
henrigrimm/minnow · src/skills/_template/SKILL.md · Describe what this skill does and when Minnow should apply it. Include example phrases users might say, such as "help…
henrigrimm/minnow · src/skills/ask-user/SKILL.md · Gather structured answers from the user with the ask_question tool when requirements, scope, or priorities are…
henrigrimm/minnow · src/skills/browser-automation/SKILL.md · Drive Minnow's visible preview or isolated Agent Browser for login flows, SPAs, and screenshots. Use when fetch tools…
henrigrimm/minnow · src/skills/caveman/SKILL.md · Ultra-compressed communication mode. Cuts token usage ~75% by speaking like caveman while keeping full technical…
anthropics/skills · skills/frontend-design/SKILL.md · Guidance for distinctive, intentional visual design when building new UI or reshaping an existing one. Helps with…
bytedance/deer-flow · skills/public/frontend-design/SKILL.md · Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to…
anthropics/claude-plugins-official · plugins/frontend-design/skills/frontend-design/SKILL.md · Guidance for distinctive, intentional visual design when building new UI or reshaping an existing one. Helps with…
mvschwarz/openrig · packages/daemon/specs/agents/shared/skills/process/frontend-design/SKILL.md · Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to…
mvschwarz/openrig · skills/_canonical/process/frontend-design/SKILL.md · Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to…
