Skip to content

OpenClaw Design Audit

Audits OpenClaw frontend code and rendered UIs for design-system drift, accessibility, and copy issues.

Stars
9,546
Licence
MIT
Files
5 files

What it does

When installed, the agent reviews OpenClaw frontend code and rendered pages against the project's Carapace design system. It checks for token misuse, reimplemented UI primitives, accessibility problems, responsive layout defects, and off-brand copy, then reports findings with file and line, severity, and a suggested fix. It separates strict rule violations from matters of judgment, and can apply only narrow fixes when asked, following a fix policy.

Great for

  • Maintainers of OpenClaw or Carapace-based frontends running design compliance reviews
  • Developers preparing a pull request who want a pre-merge design check
  • Teams running scheduled audit-and-fix workflows that open GitHub pull requests

Skip it if

  • Projects that do not use OpenClaw or the Carapace design system, since the rubric is specific to those conventions
  • Unattended automatic fixing without review, because the skill can edit code and open pull requests on a schedule

Try asking

  • “Run a design audit on the dashboard routes at desktop and mobile sizes and list drift findings”
  • “Check this component for token misuse and reimplemented primitives against Carapace”
  • “Audit the marketing pages for off-brand copy and accessibility issues”
  • “Apply narrow fixes for the warnings from the last audit, following the fix policy”
Step-by-step guide: how to use OpenClaw Design AuditInstall, first run, examples, tips and FAQs

Install in 3 steps

  1. 1

    Download the skill

    The ZIP contains the 5 original files, the MIT licence and an attribution note.

    openclaw-design-audit.zip
  2. 2

    Add it to your agent

    Claude Code (all projects)

    mkdir -p ~/.claude/skills && unzip openclaw-design-audit.zip -d ~/.claude/skills/

    Claude Code / Agent SDK (this project only)

    mkdir -p .claude/skills && unzip openclaw-design-audit.zip -d .claude/skills/

    Claude apps (web/desktop): Settings → Capabilities → Skills → Upload skill, and choose the ZIP.

  3. 3

    Ask for the task

    No special command needed — the agent reads the skill's description and loads it when your request matches. Try one of the prompts above.

Get better results

  • Start with a read-only audit and review the report before allowing any fixes or pull requests.
  • Provide the installed Carapace version and the routes to inspect so the agent checks the right targets.
  • Treat informational findings as suggestions; only documented rules count as violations.

What's inside

  • references/fix-policy.md
  • references/github-pr-delivery.md
  • references/report-format.md
  • references/rubric.md
  • SKILL.md

Redistributed unmodified from openclaw/clawhub under the MIT licence. The assessment was drafted with AI from the skill's files on 2026-10-29. Skills can instruct your agent to run code — read SKILL.md and any scripts before installing.