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

DESIGN.md Spec Review

by different-ai in different-ai/openwork

Advisory review of a diff that flags user-facing UI changes breaking numbered rules in the repository's DESIGN.md, reporting at medium or low severity only.

Custom licenceAuto-check passedFrontend & Design

Install DESIGN.md Spec Review

skills CLI
$ npx skills add different-ai/openwork --skill design-spec-review -a claude-code

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

GitHub CLI
$ gh skill install different-ai/openwork design-spec-review --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/different-ai/openwork.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.warden/skills/design-spec-review .claude/skills/design-spec-review && 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
design-spec-review
GitHub stars
24k
Token cost
~1.7k tokens
SKILL.md length
938 words
Files
1
Skills in repo
33
Repo updated
First seen
Licence
Custom licence

At a glance

Advisory review of a diff that flags user-facing UI changes breaking numbered rules in the repository's DESIGN.md, reporting at medium or low severity only.

  • Reviewing a pull request that touches the OpenWork app UI
  • SKILL.md covers What to check (one finding per…, Do NOT report and Report format
  • Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md
  • Checking new screens against the copy and layout rules in DESIGN.md

What it does

The agent reads `DESIGN.md` at the repo root as the single source of truth, then examines only changed lines in user-facing surfaces: the app's React UI and styles, the desktop renderer, the den-web app and MCP App or artifact view sources. Tests, mocks, fixtures, Storybook, docs and server code are ignored. Each finding cites a rule ID and covers one root cause. A clear violation is reported as medium, a likely but unconfirmed one as low, and never as high, so findings never block Warden clearance.

Checks include a card or dialog that shows both a title and a description, new explanatory prose on default screens, vague button labels such as Submit or OK instead of verb-first ones, raw tool IDs or JSON shown to end users, locked states styled as errors, ALL-CAPS eyebrow labels, hand-rolled buttons or dialogs where a shared component exists, and nested cards. The skill is limited to the read-only tools Read, Grep and Glob.

When your agent uses it

  • Reviewing a pull request that touches the OpenWork app UI
  • Checking new screens against the copy and layout rules in DESIGN.md
  • Spotting hand-rolled components where a shared primitive already exists

Example prompts

  • “Review this diff against DESIGN.md and cite the rule IDs.”
  • “Check my new settings page for button labels and extra descriptions that break the design spec.”
  • “Did this change put a card inside another card anywhere?”

Requirements

  • A `DESIGN.md` file with numbered rules at the repository root
  • Pre-approved tools (allowed-tools): Read, Grep, Glob

What it can do on your machine

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

  • Tool permissions

    Pre-approves these tools, so the agent can use them without asking each time:

    • Read
    • Grep
    • Glob

    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

DESIGN.md Spec Review loads about 1.7k tokens when it runs. Until then it costs about 32 tokens; SKILL.md has 938 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~32
When it runs · the whole SKILL.md, loaded when a task matches
~1.7k

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

Its licence (Custom licence) doesn't allow us to republish the file, so here is its outline and opening line. It has 938 words (~1,735 tokens).

“You are reviewing a diff to answer one question: does this change introduce user-facing UI that violates a numbered rule in DESIGN.md? Read DESIGN.md at the repository root first; it is the single source of truth. Cite rule ids (P2…”

— opening of SKILL.md by different-ai, Custom licence
name
design-spec-review
allowed-tools
Read, Grep, Glob

Read the full SKILL.md on GitHub

Files

Just SKILL.md in .warden/skills/design-spec-review of different-ai/openwork.

Open the folder on GitHubat commit ad22cdc

Compare with similar skills

DESIGN.md Spec Review 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.

DESIGN.md Spec Review compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
DESIGN.md Spec Review this skilldifferent-ai/openwork24k—~1.7kAutomated safety check: PassCustom licence
Web Design EngineerConardLi/garden-skills13k—~8.8kAutomated safety check: PassMIT
Cds Design To Codecoinbase/cds506—~4.9kAutomated safety check: PassApache-2.0
Frontend DesignCitrus-bit/Anaxa120—~1.9kAutomated safety check: PassApache-2.0
Plate UIudecode/plate17k—~2.6kAutomated safety check: PassCustom licence
Using Docs Kitlobehub/lobe-ui2.2k—~2.8kAutomated safety check: PassMIT

Similar skills

  • Web Design Engineer

    ConardLi/garden-skills

    Builds polished browser-rendered HTML, CSS, JavaScript and React pages, dashboards, prototypes and slide decks, aiming for a stunning rather than merely functional result.

    13k GitHub stars~8.8k tokensUpdated today
    Frontend & DesignAuto-check passed

  • Cds Design To Code

    coinbase/cds

    Turn Figma designs into CDS React (cds-web) or React Native (cds-mobile) code.

    506 GitHub stars~4.9k tokensUpdated 4 days ago
    Frontend & DesignAuto-check passed

  • Frontend Design

    Citrus-bit/Anaxa

    Create distinctive, production-grade frontend interfaces with high design quality for new standalone web artifacts, pages, posters, dashboards, React components, HTML/CSS layouts, or clearly…

    120 GitHub stars~1.9k tokensUpdated 1 mo ago
    Frontend & DesignAuto-check passed

  • Plate UI

    udecode/plate

    Build new shadcn-style components for Plate's registry and editor surfaces.

    17k GitHub stars~2.6k tokensUpdated yesterday
    Frontend & DesignAuto-check passed

  • Using Docs Kit

    lobehub/lobe-ui

    Set up and author a documentation site with @lobehub/docs-kit (the lobedocs CLI, React Router + Vite static docs used by ui.lobehub.com).

    2.2k GitHub stars~2.8k tokensUpdated today
    Frontend & DesignAuto-check passed

  • React Render Types Composition

    HorusGoul/eslint-plugin-react-render-types

    Composition patterns for building React components with @renders type annotations from eslint-plugin-react-render-types.

    111 GitHub stars~1.1k tokensUpdated 2 mo ago
    Frontend & DesignAuto-check passed

More from different-ai/openwork

All 33 skills in this repo

  • OpenWork Desktop CDP Driver

    different-ai/openwork

    Drives a running OpenWork desktop window over CDP from the shell to evaluate JS, take screenshots, start sessions and send prompts for hand checks.

    24k GitHub stars~465 tokensUpdated today
    Auto-check passed

  • Fake Model Provider Faults

    different-ai/openwork

    Makes the desktop app's model provider fail on demand, with refused connections, resets, stalls and HTTP 4xx and 5xx errors, so error and retry states can be reproduced.

    24k GitHub stars~642 tokensUpdated today
    Auto-check passed

  • OpenWork Model Alias Manager

    different-ai/openwork

    Manages OpenWork's inference model aliases, discounts and overlays over the upstream OpenRouter catalog, and triggers the GitHub workflow that refreshes base models.

    24k GitHub stars~1.1k tokensUpdated today
    Auto-check passed

  • Reproduce Chat States

    different-ai/openwork

    Fires known chat states in the running OpenWork desktop app, such as provider errors, retries and tool steps, so you can check how each renders.

    24k GitHub stars~673 tokensUpdated today
    Auto-check passed

  • OpenWork Electron Browser Automation

    different-ai/openwork

    Attaches OpenCode browser tools to the OpenWork Electron dev app through CDP to explore its UI, send a composer task and debug, not to give test verdicts.

    24k GitHub stars~780 tokensUpdated today
    Auto-check passed

  • Daytona Sandbox Operations

    different-ai/openwork

    Covers Daytona CLI setup, sandbox debugging, keeping a sandbox alive and which credentials the CLI uses, for when Daytona itself is the problem rather than the tests.

    24k GitHub stars~917 tokensUpdated today
    Auto-check passed

Works with

Categories

Questions about DESIGN.md Spec Review

What does DESIGN.md Spec Review do?

Advisory review of a diff that flags user-facing UI changes breaking numbered rules in the repository's DESIGN.md, reporting at medium or low severity only. md` at the repo root as the single source of truth, then examines only changed lines in user-facing surfaces: the app's React UI and styles, the desktop renderer, the den-web app and MCP App or artifact view sources. Tests, mocks, fixtures, Storybook, docs and server code are ignored.

When should I use DESIGN.md Spec Review?

DESIGN.md Spec Review fits situations like: reviewing a pull request that touches the OpenWork app UI; checking new screens against the copy and layout rules in DESIGN.md; spotting hand-rolled components where a shared primitive already exists.

How do I install DESIGN.md Spec Review in Claude Code?

Run `npx skills add different-ai/openwork --skill design-spec-review -a claude-code`. Or copy the skill folder (.warden/skills/design-spec-review in different-ai/openwork) into .claude/skills/design-spec-review in your project. Claude Code loads it when a task matches its description.

How do I install DESIGN.md Spec Review in Codex?

Run `npx skills add different-ai/openwork --skill design-spec-review -a codex`. Or copy the skill folder (.warden/skills/design-spec-review in different-ai/openwork) into .agents/skills/design-spec-review in your project. Codex loads it when a task matches its description.

Can I use DESIGN.md Spec Review 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 different-ai/openwork --skill design-spec-review -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/design-spec-review, .gemini/skills/design-spec-review, .github/skills/design-spec-review and .opencode/skills/design-spec-review in your project.

What does DESIGN.md Spec Review need to run?

SKILL.md names no scripts, command-line tools or credentials: DESIGN.md Spec Review is instructions for the agent only. Our summary lists: A `DESIGN.md` file with numbered rules at the repository root. Its frontmatter pre-approves these tools: Read, Grep, Glob.

Does DESIGN.md Spec Review 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 DESIGN.md Spec Review 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 DESIGN.md Spec Review use?

DESIGN.md Spec Review has a licence file (the repository's licence) that doesn't match a standard licence. Read it on GitHub before reusing the skill.

How many tokens does DESIGN.md Spec Review use?

About 1.7k tokens (SKILL.md is roughly 6.9k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to DESIGN.md Spec Review?

Skills that share tags, products or a category with DESIGN.md Spec Review: Web Design Engineer (ConardLi/garden-skills, 13k stars), Cds Design To Code (coinbase/cds, 506 stars), Frontend Design (Citrus-bit/Anaxa, 120 stars) and Plate UI (udecode/plate, 17k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains DESIGN.md Spec Review?

different-ai (a GitHub organization) maintains it in different-ai/openwork, which has 23,993 GitHub stars. The repository holds 33 skills in this directory. The repository was last updated on October 11, 2026.

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