New: 98,000+ skills indexed from GitHub repos with 100+ stars · every skill safety-checkedBrowse top skillsTop skills
Esc to closeBrowse all skills
Submit a skillBrowse skills
Submit a skillBrowse skills

Agent skill

OpenClaw Design Audit

by openclaw in openclaw/clawhub

Audits OpenClaw frontend code and rendered pages for token misuse, reimplemented primitives, accessibility and responsive defects and off-brand copy, with an evidence-based report.

MITAuto-check passedFrontend & Design

Install OpenClaw Design Audit

skills CLI
$ npx skills add openclaw/clawhub --skill openclaw-design-audit -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install openclaw/clawhub openclaw-design-audit --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/openclaw/clawhub.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.agents/skills/openclaw-design-audit .claude/skills/openclaw-design-audit && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
openclaw-design-audit
GitHub stars
9.5k
Token cost
~498 tokens
SKILL.md length
209 words
Files
5 (incl. references)
Skills in repo
55
Repo updated
First seen
Licence
MIT

At a glance

Audits OpenClaw frontend code and rendered pages for token misuse, reimplemented primitives, accessibility and responsive defects and off-brand copy, with an evidence-based report.

  • Works in 10 steps: Read rubric.md and run every applicable… → Read the consumer's installed Carapace… → Read the version-matched token contract… → …
  • Running a design compliance check on an OpenClaw frontend before a release
  • SKILL.md covers Workflow, Evidence and Curation
  • Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md

What it does

This skill runs a design review against the Carapace design system. The agent works through a rubric category by category, notes the installed Carapace version and commit, reads the matching token contract and adapters, runs deterministic source checks first and only then makes judgment-based observations. It inspects representative routes at desktop and mobile sizes, in light and dark themes where the product supports both.

Output is a JSON file and a Markdown report in a defined format. Each finding carries a file and line, a category and severity, a stable rule ID, a short fix, a Carapace reference and a flag saying whether it is mechanical or a matter of judgment. All errors are listed, warnings rank ahead of informational items, and the concise report shows at most five non-error findings. When asked to fix findings, the agent follows a fix policy limited to narrow changes, and a separate reference describes pull-request delivery for scheduled runs.

When your agent uses it

  • Running a design compliance check on an OpenClaw frontend before a release
  • Finding places where components bypass shared primitives or use raw palette values
  • Setting up a scheduled audit that reports or fixes design drift in a pull request

Example prompts

  • “Audit the dashboard routes for Carapace drift and give me the JSON and Markdown report.”
  • “Check this app at desktop and mobile widths in both themes for responsive and accessibility problems.”
  • “Fix only the mechanical findings from the last audit and open them as a single pull request.”

Requirements

  • A frontend project that uses the Carapace package

Workflow steps

10 steps, taken from the first numbered list in SKILL.md.

  1. Read rubric.md and run every applicable category.
  2. Read the consumer's installed Carapace version and current commit SHA.
  3. Read the version-matched token contract and consumer adapters from the
  4. Read the brand or marketing references when those categories apply.
  5. Run deterministic source checks before judgment-based review.
  6. Inspect representative rendered routes at desktop and mobile sizes.
  7. Check light and dark themes where supported.
  8. Emit the JSON and Markdown defined in report-format.md.
  9. When asked to fix findings, apply only narrow changes allowed by fix-policy.md.
  10. For scheduled ClawHub delivery, follow github-pr-delivery.md.

What it can do on your machine

Read from SKILL.md and the folder at commit d044664. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    No scripts in the folder and no shell commands in SKILL.md.

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

OpenClaw Design Audit loads about 498 tokens when it runs, and up to ~2.1k if it reads all its reference files. Until then it costs about 70 tokens; SKILL.md has 209 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~70
When it runs · the whole SKILL.md, loaded when a task matches
~498
With references · SKILL.md plus every file in references/, read only if the agent opens them
~2.1k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from openclaw/clawhub at commit d044664, republished under its MIT licence (© openclaw). 209 words, ~498 tokens.

Download SKILL.mdSave it as .claude/skills/openclaw-design-audit/SKILL.md (or your agent's skills folder). This skill also uses 4 other files; get the full folder from GitHub.
name
openclaw-design-audit
description
Audit OpenClaw frontend code and rendered interfaces for Carapace drift, token misuse, primitive reimplementation, accessibility problems, responsive defects, and off-brand copy. Use for design reviews, compliance checks, or scheduled audit-and-fix workflows.

OpenClaw Design Audit

Separate mechanical violations from judgment. Report suggestions as suggestions unless a documented rule makes them violations.

Workflow

  1. Read rubric.md and run every applicable category.
  2. Read the consumer's installed Carapace version and current commit SHA.
  3. Read the version-matched token contract and consumer adapters from the installed product guidance skill: openclaw-carapace for new installs or the openclaw-design-system compatibility alias for an upgraded lock.
  4. Read the brand or marketing references when those categories apply.
  5. Run deterministic source checks before judgment-based review.
  6. Inspect representative rendered routes at desktop and mobile sizes.
  7. Check light and dark themes where supported.
  8. Emit the JSON and Markdown defined in report-format.md.
  9. When asked to fix findings, apply only narrow changes allowed by fix-policy.md.
  10. For scheduled ClawHub delivery, follow github-pr-delivery.md.

Evidence

Each finding must include:

  • file and line
  • category and severity
  • stable rule ID
  • concise remediation
  • Carapace reference
  • whether the finding is mechanical or judgment-based

Curation

  • Include every error.
  • Rank warnings before informational findings, then by affected-file count.
  • Surface at most five non-error findings in the concise report.
  • Summarize remaining non-error findings by count.
  • Treat zero errors, zero warnings, and five or fewer informational findings as no significant drift.
  • Never invent source locations or visual evidence.

© openclaw, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

SKILL.md and 4 other files (references) in .agents/skills/openclaw-design-audit of openclaw/clawhub.

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

Open the folder on GitHubat commit d044664

Compare with similar skills

OpenClaw Design Audit next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

OpenClaw Design Audit compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
OpenClaw Design Audit this skillopenclaw/clawhub9.5k—~498Automated safety check: PassMIT
Material Design 3 UI/UX Guideskydashnet/material-design-3-ui-skill135—~3kAutomated safety check: PassMIT
UI Design Systemtry-works/role-model118—~5kAutomated safety check: PassMIT
Frontend Designjwynia/agent-skills169—~3.2kAutomated safety check: PassMIT
Design Handoff Specgetcrew44/crew44356—~680Automated safety check: PassMIT
Bmad UXaj-geddes/claude-code-bmad-skills488—~2kAutomated safety check: NotesCustom licence

Similar skills

  • Material Design 3 UI/UX Guide

    skydashnet/material-design-3-ui-skill

    Guides designing, reviewing or implementing interfaces that follow Google's Material Design 3 system: semantic tokens, component states, adaptive layout and accessibility.

    135 GitHub stars~3k tokensUpdated 9 days ago
    Frontend & DesignAuto-check passed

  • UI Design System

    try-works/role-model

    React UI component systems with TailwindCSS + Radix + shadcn/ui.

    118 GitHub stars~5k tokensUpdated 2 days ago
    Frontend & DesignAuto-check passed

  • Frontend Design

    jwynia/agent-skills

    Create distinctive, production-grade frontend interfaces with high design quality.

    169 GitHub stars~3.2k tokensUpdated 7 mo ago
    Frontend & DesignAuto-check passed

  • Design Handoff Spec

    getcrew44/crew44

    Produces an implementation-ready spec from a finished design, covering layout, tokens, states, responsive behavior, edge cases, motion and accessibility, so engineers do not have to guess.

    356 GitHub stars~680 tokensUpdated 4 mo ago
    Frontend & DesignAuto-check passed

  • Bmad UX

    aj-geddes/claude-code-bmad-skills

    Solutioning-phase UX planning skill (optional; activate when the project has a UI).

    488 GitHub stars~2k tokensUpdated 3 mo ago
    Frontend & DesignAuto-check: notes

  • Design Standards

    rampstackco/claude-skills

    Apply production-grade design standards when building or reviewing pages, components, or UI.

    941 GitHub stars~2.4k tokensUpdated 2 days ago
    Frontend & DesignAuto-check passed

More from openclaw/clawhub

All 55 skills in this repo

  • Axiom Alerting Management

    openclaw/clawhub

    Creates and manages Axiom monitors and notifiers end to end through the v2 API, with scripts for each CRUD operation and a recommended create-validate-tune workflow.

    9.5k GitHub stars~2.1k tokensUpdated yesterday
    Auto-check passed

  • Axiom Dashboard Builder

    openclaw/clawhub

    Designs and deploys Axiom dashboards through the API, choosing chart types and writing APL or metrics queries, with templates and migration notes for Splunk and Grafana.

    9.5k GitHub stars~4.9k tokensUpdated yesterday
    Auto-check passed

  • Axiom Cost Control

    openclaw/clawhub

    Finds unused data in Axiom by analyzing query patterns, then deploys a cost dashboard and ingest monitors to keep spend under the contract limit.

    9.5k GitHub stars~1.7k tokensUpdated yesterday
    Auto-check passed

  • Axiom Metrics Query

    openclaw/clawhub

    Explores and queries OpenTelemetry metrics in Axiom MetricsDB, listing datasets, metrics and tags first and picking the right aggregation for each metric's type.

    9.5k GitHub stars~2.6k tokensUpdated yesterday
    Auto-check passed

  • Axiom SRE Investigator

    openclaw/clawhub

    Investigates incidents and production problems with hypothesis-driven debugging, queries Axiom observability data when available, and keeps secrets out of commands and output.

    9.5k GitHub stars~7.1k tokensUpdated yesterday
    Auto-check passed

  • Axiom Eval Writer

    openclaw/clawhub

    Scaffolds evaluation suites for the Axiom AI SDK: eval files, scorers, flag schemas and axiom.config.ts, generated from plain descriptions of an AI capability.

    9.5k GitHub stars~4.1k tokensUpdated yesterday
    Auto-check: warnings

Works with

Categories

Questions about OpenClaw Design Audit

What does OpenClaw Design Audit do?

Audits OpenClaw frontend code and rendered pages for token misuse, reimplemented primitives, accessibility and responsive defects and off-brand copy, with an evidence-based report. This skill runs a design review against the Carapace design system. The agent works through a rubric category by category, notes the installed Carapace version and commit, reads the matching token contract and adapters, runs deterministic source checks first and only then makes judgment-based observations.

When should I use OpenClaw Design Audit?

OpenClaw Design Audit fits situations like: running a design compliance check on an OpenClaw frontend before a release; finding places where components bypass shared primitives or use raw palette values; setting up a scheduled audit that reports or fixes design drift in a pull request.

How do I install OpenClaw Design Audit in Claude Code?

Run `npx skills add openclaw/clawhub --skill openclaw-design-audit -a claude-code`. Or copy the skill folder (.agents/skills/openclaw-design-audit in openclaw/clawhub) into .claude/skills/openclaw-design-audit in your project. Claude Code loads it when a task matches its description.

How do I install OpenClaw Design Audit in Codex?

Run `npx skills add openclaw/clawhub --skill openclaw-design-audit -a codex`. Or copy the skill folder (.agents/skills/openclaw-design-audit in openclaw/clawhub) into .agents/skills/openclaw-design-audit in your project. Codex loads it when a task matches its description.

Can I use OpenClaw Design Audit in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add openclaw/clawhub --skill openclaw-design-audit -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/openclaw-design-audit, .gemini/skills/openclaw-design-audit, .github/skills/openclaw-design-audit and .opencode/skills/openclaw-design-audit in your project.

What does OpenClaw Design Audit need to run?

SKILL.md names no scripts, command-line tools or credentials: OpenClaw Design Audit is instructions for the agent only. Our summary lists: A frontend project that uses the Carapace package.

Does OpenClaw Design Audit access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is OpenClaw Design Audit safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does OpenClaw Design Audit use?

OpenClaw Design Audit is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does OpenClaw Design Audit use?

About 498 tokens (SKILL.md is roughly 2k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 1.6k tokens, read only when the agent opens those files.

What are the alternatives to OpenClaw Design Audit?

Skills that share tags, products or a category with OpenClaw Design Audit: Material Design 3 UI/UX Guide (skydashnet/material-design-3-ui-skill, 135 stars), UI Design System (try-works/role-model, 118 stars), Frontend Design (jwynia/agent-skills, 169 stars) and Design Handoff Spec (getcrew44/crew44, 356 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains OpenClaw Design Audit?

openclaw (a GitHub organization) maintains it in openclaw/clawhub, which has 9,500 GitHub stars. The repository holds 55 skills in this directory. The repository was last updated on October 8, 2026.

Source: openclaw/clawhub on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.