audit-frontend-design
Use when reviewing or changing a React, Next.js, Tailwind, or shadcn interface and you need evidence-backed findings for accessibility, hierarchy, tokens…
Skill by memi-design
Install
Works with Claude Code, Claude apps, Codex, Cursor, Gemini CLI, GitHub Copilot, VS Code, OpenCode, Goose, Windsurf. Read the repository before you give any tool access to your data.
npx agentmarket install skill/memi-design-audit-frontend-design-04aea4
Asks which of your tools to add it to (Claude Code, Codex, Cursor, VS Code, Windsurf, Gemini CLI, Claude Desktop) and shows the change first. See https://agentmart.dev/cli.
Get the weekly diff
The weekly diff: one email a week with new agent tools, notable updates and grade changes, plus security alerts for tools you follow. Double opt-in, one-click unsubscribe.
About
Use cases: design, frontend, security, writing
Reviews
Write a reviewNo reviews yet. Installed it? Reviews come from verified installers only. How reviews work
Permissions: not checked yet.
What's inside
- Skill name
audit-frontend-design- Description
- Use when reviewing or changing a React, Next.js, Tailwind, or shadcn interface and you need evidence-backed findings for accessibility, hierarchy, tokens, states, and responsive design before editing code.
- License
- MIT
- Instructions
- 43 lines in SKILL.md · view on GitHub
Files (2)
- SKILL.md
- openai.yaml · agents/
SKILL.md (first lines)
# Audit Frontend Design Audit the real source tree before proposing UI changes. Memi's checks are deterministic and file-anchored; no Figma connection or background process is required. This workflow targets published beta **2.8.0-beta.2**. Use `npx -y @memi-design/cli@2.8.0-beta.2 --version` to verify the exact package; a local `memi` must report that same version before these recipes run. The independent stable compatibility baseline is **2.7.9**. See [current release state](https://github.com/memi-design/memi/blob/main/docs/CURRENT_RELEASE.md) and [known limitations](https://github.com/memi-design/memi/blob/main/docs/trust/KNOWN_LIMITATIONS.md). npm availability alone does not establish native-binary success. ## Run The Audit From the repository root: ```bash memi diagnose . --json --no-write --fail-on none ``` For UX behavior and visual craft detail, run only the relevant follow-up: ```bash memi ux audit . --json --no-write memi craft audit . --json --no-write ``` A supplied screenshot is context, not proof that Memi performed pixel analysis. Use the harness browser or image tools for actual rendered checks. Use `memi diagnose . --receipt-only --fail-on none` when the output must exclude source content. ## Workflow 1. Read repository instructions and identify the requested route or component. 2. Run `diagnose` before broad UI edits. 3. Group findings by user impact, not by checker name. 4. Verify each proposed fix against the cited file and local design tokens. 5. Implement only fixes relevant to the user's request. 6. Re-run the same command and report assessed quality, category coverage, scan omissions, and remaining findings. ## Output Lead with actionable findings: | Priority | Evidence | Change | | --- | --- | --- | | High | `path/to/file.tsx:line` and rule id | Specific code-level fix | Include the command run, before/after score, files changed, and unresolved risks. Never replace source evidence with generic taste advice.
From memi-design/memi, MIT.
More from memi-design/memi
- 0.654score
memi
memi-design
Memi is the design layer for agentic AI.
ConnectorAFreshness: ALocal★ 48↓ 96/wkClaude Code +5 - 0.618score
memoire-design-tooling
memi-design
Use when a task spans interface understanding, design-system memory, UI audits, design CI, Figma, shadcn or Tailwind code generation, research, or agent…
SkillBFreshness: B★ 48Claude Code +9 - 0.618score
memoire-design-tooling
memi-design
Use when a Grok Build task involves UI design, interface understanding, Figma, design systems, shadcn/ui, Tailwind, UX audits, Atomic Design, component specs…
SkillBFreshness: B★ 48Claude Code +9 - 0.618score
memoire-design-tooling
memi-design
Use when a Hermes session involves UI design, interface craft, Figma, design systems, shadcn/ui, Tailwind, Atomic Design, research synthesis, component specs…
SkillBFreshness: B★ 48Claude Code +9 - 0.618score
memoire-design-tooling
memi-design
Use when an OpenClaw workspace task involves UI design, interface craft, Figma, design systems, shadcn/ui, Tailwind, Atomic Design, research synthesis, design…
SkillBFreshness: B★ 48Claude Code +9 - 0.618score
memoire-design-tooling
memi-design
Use when an OpenCode task involves UI design, interface craft, Figma, design systems, shadcn/ui, Tailwind, Atomic Design, research synthesis, component specs…
SkillBFreshness: B★ 48Claude Code +9 - 0.618score
audit-frontend-design
memi-design
Use when reviewing or changing a React, Next.js, Tailwind, or shadcn interface and you need evidence-backed findings for accessibility, hierarchy, tokens…
SkillBFreshness: B★ 48Claude Code +9 - 0.618score
build-swiftui-interface
memi-design
Use when a coding agent must design, scaffold, implement, or verify an iOS or macOS SwiftUI interface with Apple-platform state, accessibility, availability…
SkillBFreshness: B★ 48Claude Code +9 - 0.618score
enforce-design-ci
memi-design
Use when a repository needs deterministic pull-request checks for new accessibility, design-token, component-structure, responsive, and UI-state regressions…
SkillBFreshness: B★ 48Claude Code +9 - 0.618score
remember-design-system
memi-design
Use when an agent is about to build or refactor interface code and needs a compact, repository-specific brief covering existing tokens, components, routes…
SkillBFreshness: B★ 48Claude Code +9
Signals
- Stars
- 48
- Forks
- 6
- Open issues
- 0
- Contributors
- 5
- Last commit (this folder)
- Sep 8, 2026 (1 month ago)
- Last release
- Aug 8, 2026 (2 months ago)
From GitHub (fetched Oct 24, 2026).
Details
- License
- MIT
- Repository
- github.com/memi-design/memi
- Website
- memoire.cv
- First seen
- Oct 24, 2026
- Last checked
- Oct 24, 2026
- Source
- GitHubgithub-graphql
Same skill elsewhere
Copies of this SKILL.md published by others; search shows only one of them.
- 0.618score
audit-frontend-design
memi-design
Use when reviewing or changing a React, Next.js, Tailwind, or shadcn interface and you need evidence-backed findings for accessibility, hierarchy, tokens…
SkillBFreshness: B★ 48Claude Code +9 - 0.371score
audit-frontend-design
memi-design
Use when reviewing or changing a React, Next.js, Tailwind, or shadcn interface and you need evidence-backed findings for accessibility, hierarchy, tokens…
SkillBFreshness: B★ 48Claude Code +9
More from memi-design
- 0.654score
memi
memi-design
Memi is the design layer for agentic AI.
ConnectorAFreshness: ALocal★ 48↓ 96/wkClaude Code +5 - 0.618score
memoire-design-tooling
memi-design
Use when a task spans interface understanding, design-system memory, UI audits, design CI, Figma, shadcn or Tailwind code generation, research, or agent…
SkillBFreshness: B★ 48Claude Code +9 - 0.618score
memoire-design-tooling
memi-design
Use when a Grok Build task involves UI design, interface understanding, Figma, design systems, shadcn/ui, Tailwind, UX audits, Atomic Design, component specs…
SkillBFreshness: B★ 48Claude Code +9 - 0.618score
memoire-design-tooling
memi-design
Use when a Hermes session involves UI design, interface craft, Figma, design systems, shadcn/ui, Tailwind, Atomic Design, research synthesis, component specs…
SkillBFreshness: B★ 48Claude Code +9 - 0.618score
memoire-design-tooling
memi-design
Use when an OpenClaw workspace task involves UI design, interface craft, Figma, design systems, shadcn/ui, Tailwind, Atomic Design, research synthesis, design…
SkillBFreshness: B★ 48Claude Code +9 - 0.618score
memoire-design-tooling
memi-design
Use when an OpenCode task involves UI design, interface craft, Figma, design systems, shadcn/ui, Tailwind, Atomic Design, research synthesis, component specs…
SkillBFreshness: B★ 48Claude Code +9
Cite this page
audit-frontend-design skill. Agent Mart. https://agentmart.dev/skills/memi-design-audit-frontend-design-04aea4 (last updated 2026-10-24)