claudecodex

design

Canvas-first iteration on HTML mocks under <designRoot> (default `.design/`), element selection via Cmd+Click, auto-managed dev server. Daily verbs: /design:edit /design:new /design:rollback /design:screenshot /design:critic /design:browse /design:handoff /design:help. Setup: /design:init /design:setup-ds /design:setup-docs.

3 on GitHubby 1aGhv2.2.1MITupdated yesterdaydesign
/

Plugin design from marketplace maude in 1aGh/maude. Commands read from the repo's manifest — today.

This plugin runs code on your machine — its hooks fire automatically on events like tool use. The exact commands are listed below; read them before installing.

What it installs

Skills (37)

  • source-command-assets

    List the project's assets, see where each is used, find the ones nothing uses, and search pictures by what they show.

  • source-command-board

    Read the annotations on a canvas, or lay out a structured template of sticky notes (retro, kanban, roadmap) on it.

  • source-command-browse

    Start the Maude studio for this project and open it.

  • source-command-chat

    Open the AI chat panel in the running Maude window, or continue an in-app chat from a terminal.

  • source-command-comments

    Read the open comments on a canvas, make the changes they ask for, then reply and resolve each thread.

  • source-command-critic

    Review the active canvas with the selected specialist critic panel.

  • source-command-draw

    Create and verify SVG logos, icons, illustrations or diagrams with the geometry engine.

  • source-command-edit

    Apply feedback to the active canvas in place, then verify and run the configured critic loop.

  • source-command-export

    Export a canvas to images, documents, slides, video or a handoff bundle.

  • source-command-generate

    Generate media through Maude BYOK providers and place the resulting asset on the canvas.

  • source-command-handoff

    Create a shadcn registry handoff for the active canvas.

  • source-command-help

    List available design workflows and their invocation names.

  • source-command-history

    List, show and restore versions of a canvas in Version history; name a version.

  • source-command-hub-workspace

    Set up and verify a self-hosted Maude workspace.

  • source-command-import

    Import a Figma document or reconstruct a design from an image.

  • source-command-init

    Initialize project design configuration and check dependencies.

  • source-command-new

    Create a canvas with several artboards, an empty brief canvas, or artboards from annotations; verify with the critic loop.

  • source-command-open

    Show a canvas, an artboard, an element or a panel in the Maude window.

  • source-command-photo

    Adjust or retouch a canvas photo, apply masks, or remove its background.

  • source-command-present

    Set the order, skipped artboards and speaker notes for Present, then open the canvas in Present.

  • source-command-rollback

    Go back to an earlier version of the active canvas, from Version history.

  • source-command-screenshot

    Capture the active canvas, one artboard, an element or all screens.

  • source-command-setup-docs

    Refresh the design root README and canvas index.

  • source-command-setup-ds

    Create or re-bootstrap a named design system.

  • source-command-smoke

    Screenshot UI canvases and design specimens to detect blank, broken or unstyled output.

  • source-command-system

    Work with the project's design systems: where each stands, the default for new canvases, switching canvases, outside changes, moving a system folder onto its Design system canvas, importing tokens.

  • source-command-to-rn

    Create a React Native SVG animation fallback for light motion.

  • source-command-trash

    See what is in the Trash, move a canvas to it, and restore a canvas or artboard from it.

  • ai-generation

    Generate or edit Maude images and audio through configured BYOK providers; localize assets and preserve consent.

  • contract-voice

    Maude's product voice for the words the AI writes in the AI chat panel and into Maude's own fields: chat replies, run results, comment text, version names, chat titles. Load before writing any of them.

  • design-system

    Read a canvas design system, bootstrap a new system, or check its completeness. Select the matching mode.

  • design

    Design or edit Maude canvases using the project design system, snapshots, screenshots and specialist critique.

  • self-host
  • studio-actions
  • ui-kit
  • ux-patterns
  • whiteboard

Slash commands (28)

  • /design:assets

    List the project's assets, see where each is used, find the ones nothing uses, and search pictures by what they show.

  • /design:board

    Read the annotations on a canvas, or lay out a structured template of sticky notes (retro, kanban, roadmap) on it.

  • /design:browse

    Start the Maude studio for this project and open it.

  • /design:chat

    Open the AI chat panel in the running Maude window, or continue an in-app chat from a terminal.

  • /design:comments

    Read the open comments on a canvas, make the changes they ask for, then reply and resolve each thread.

  • /design:critic

    Review the active canvas with the selected specialist critic panel.

  • /design:draw

    Create and verify SVG logos, icons, illustrations or diagrams with the geometry engine.

  • /design:edit

    Apply feedback to the active canvas in place, then verify and run the configured critic loop.

  • /design:export

    Export a canvas to images, documents, slides, video or a handoff bundle.

  • /design:generate

    Generate media through Maude BYOK providers and place the resulting asset on the canvas.

  • /design:handoff

    Create a shadcn registry handoff for the active canvas.

  • /design:help

    List available design workflows and their invocation names.

  • /design:history

    List, show and restore versions of a canvas in Version history; name a version.

  • /design:hub-workspace

    Set up and verify a self-hosted Maude workspace.

  • /design:import

    Import a Figma document or reconstruct a design from an image.

  • /design:init

    Initialize project design configuration and check dependencies.

  • /design:new

    Create a canvas with several artboards, an empty brief canvas, or artboards from annotations; verify with the critic loop.

  • /design:open

    Show a canvas, an artboard, an element or a panel in the Maude window.

  • /design:photo

    Adjust or retouch a canvas photo, apply masks, or remove its background.

  • /design:present

    Set the order, skipped artboards and speaker notes for Present, then open the canvas in Present.

  • /design:rollback

    Go back to an earlier version of the active canvas, from Version history.

  • /design:screenshot

    Capture the active canvas, one artboard, an element or all screens.

  • /design:setup-docs

    Refresh the design root README and canvas index.

  • /design:setup-ds

    Create or re-bootstrap a named design system.

  • /design:smoke

    Screenshot UI canvases and design specimens to detect blank, broken or unstyled output.

  • /design:system

    Work with the project's design systems: where each stands, the default for new canvases, switching canvases, outside changes, moving a system folder onto its Design system canvas, importing tokens.

  • /design:to-rn

    Create a React Native SVG animation fallback for light motion.

  • /design:trash

    See what is in the Trash, move a canvas to it, and restore a canvas or artboard from it.

Subagents (20)

  • a11y-critic

    WCAG 2.1 AA review: contrast, keyboard, landmarks, labels, focus, touch targets, motion, ARIA. Spawned by /design:critic on every edit. Writes a report and hand-off only.

  • asset-describer

    Internal — spawned only by the studio describe service and `maude design describe`; never auto-delegated. Captions pictures for search; read-only.

  • brand-critic

    Brand review: canonical mark vs the DS logo specimen, placement, asset ladder, imagery style, voice. Spawned by /design:critic when a canvas has logos, brand assets or marketing copy.

  • copy-critic

    Microcopy review: clarity, tone, length, error/empty/loading states, labels, i18n, casing. Spawned by /design:critic when a canvas has user-facing strings.

  • design-critic

    Holistic UX and design-system review; the default critic. Spawned by /design:critic and the auto-critic loop of /design:edit and /design:new. Reports only.

  • design-system-completeness-critic

    Validates a design system under system/<ds>/ against Core, Conventional and Free-form rules. Runs at the end of bootstrap and with /design:critic --system-only. Never edits.

  • design-system-keeper

    Read-only DS-fidelity audit between canvas generation and the critic panel: reinvented patterns, token roles, switchability. Auto-routed by /design:new and /design:edit.

  • draw-agent

    Internal — spawned only by /design:draw, /design:new, /design:edit and /design:setup-ds; never auto-delegated. Draws ONE new SVG mark.

  • draw-critic

    Rubric judge for standalone vector art (logos, icons, illustrations): 30-check draw rubric from the SVG source. Spawned by /design:critic for custom marks and by /design:draw.

  • ds-migrator

    Internal — spawned only by /design:system migrate; never auto-delegated. Moves one system/<ds>/ folder onto a Design system canvas.

  • frontend-critic

    Frontend code-quality review of canvas JSX/HTML: semantics, React patterns, a11y primitives, naming, dead code, perf. Spawned by /design:critic after heavy JSX edits.

  • graphic-design-critic

    Visual-design review: composition, hierarchy, balance, density, rhythm, alignment, white space. Spawned by /design:critic when feedback targets layout or feel.

  • info-architecture-critic

    Information architecture review: navigation depth, hierarchy, taxonomy, naming, findability. Spawned by /design:critic for canvases with navigation, sections, search or filters.

  • media-generation-director

    Read-only gap finder for AI media generation: proposes a plan of net-new media (empty heroes, reel beats without clips). Spawned by /design-video:reel and /design:edit; never generates.

  • motion-critic

    Motion review: duration tokens, easing, choreography, reduced-motion, compositor-only properties. Spawned by /design:critic for canvases with animation or a motion specimen.

  • reconstruct-agent

    Internal — spawned only by /design:import --reconstruct; never auto-delegated. Rebuilds a source image as an artboard; no shell.

  • reconstruct-critic

    Internal — spawned only by /design:import --reconstruct; never auto-delegated. Compares source and reconstruction; no shell.

  • signature-moment-critic

    Aspiration critic: would you screenshot this for a portfolio? Scores signature moment, brand, fidelity, restraint, negative space. Spawned on /design:new and polish-cue /design:edit.

  • typography-critic

    Typography review: pairings, scale, leading, measure, rhythm, numerals, fallback chains. Spawned by /design:critic for text-heavy canvases.

  • ux-research-agent

    Domain research for /design:setup-ds (visual references) and /design:new (UX patterns): 6-8 web searches, JSON payload written to the caller's path. Spawned by those commands.

Hooks (11)

  • SessionStart

    PKG="${CLAUDE_PLUGIN_ROOT}/../.."; if [ -f "$PKG/cli/lib/preflight.mjs" ]; then (cd "$PKG" && node cli/lib/preflight.mjs --plugin design --warn-only); elif command -v maude >/dev/null 2>&1; then maude

  • SessionStart

    PKG="${CLAUDE_PLUGIN_ROOT}/../.."; if [ -f "$PKG/cli/bin/maude.mjs" ] && command -v node >/dev/null 2>&1; then node "$PKG/cli/bin/maude.mjs" design hook session-start; elif command -v maude >/dev/null

  • UserPromptSubmit

    PKG="${CLAUDE_PLUGIN_ROOT}/../.."; if [ -f "$PKG/cli/bin/maude.mjs" ] && command -v node >/dev/null 2>&1; then node "$PKG/cli/bin/maude.mjs" design hook prompt; elif command -v maude >/dev/null 2>&1;

  • PreToolUse

    PKG="${CLAUDE_PLUGIN_ROOT}/../.."; if [ -f "$PKG/cli/bin/maude.mjs" ] && command -v node >/dev/null 2>&1; then node "$PKG/cli/bin/maude.mjs" design hook pre-edit; elif command -v maude >/dev/null 2>&1

  • PreToolUse

    PKG="${CLAUDE_PLUGIN_ROOT}/../.."; if [ -f "$PKG/cli/bin/maude.mjs" ] && command -v node >/dev/null 2>&1; then node "$PKG/cli/bin/maude.mjs" design hook pre-bash; elif command -v maude >/dev/null 2>&1

  • PostToolUse

    PKG="${CLAUDE_PLUGIN_ROOT}/../.."; if [ -f "$PKG/cli/bin/maude.mjs" ] && command -v node >/dev/null 2>&1; then node "$PKG/cli/bin/maude.mjs" design hook post-edit; elif command -v maude >/dev/null 2>&

  • PostToolUse

    PKG="${CLAUDE_PLUGIN_ROOT}/../.."; if [ -f "$PKG/cli/bin/maude.mjs" ] && command -v node >/dev/null 2>&1; then node "$PKG/cli/bin/maude.mjs" design hook post-bash; elif command -v maude >/dev/null 2>&

  • PostToolUseFailure

    PKG="${CLAUDE_PLUGIN_ROOT}/../.."; if [ -f "$PKG/cli/bin/maude.mjs" ] && command -v node >/dev/null 2>&1; then node "$PKG/cli/bin/maude.mjs" design hook post-bash; elif command -v maude >/dev/null 2>&

  • Stop

    PKG="${CLAUDE_PLUGIN_ROOT}/../.."; if [ -f "$PKG/cli/bin/maude.mjs" ] && command -v node >/dev/null 2>&1; then node "$PKG/cli/bin/maude.mjs" design hook stop; elif command -v maude >/dev/null 2>&1; th

  • SubagentStart

    PKG="${CLAUDE_PLUGIN_ROOT}/../.."; if [ -f "$PKG/cli/bin/maude.mjs" ] && command -v node >/dev/null 2>&1; then node "$PKG/cli/bin/maude.mjs" design hook subagent-start; elif command -v maude >/dev/nul

  • SubagentStop

    PKG="${CLAUDE_PLUGIN_ROOT}/../.."; if [ -f "$PKG/cli/bin/maude.mjs" ] && command -v node >/dev/null 2>&1; then node "$PKG/cli/bin/maude.mjs" design hook stop; elif command -v maude >/dev/null 2>&1; th

View source on GitHub maude.sh

More from 1aGh/maude

All 3 plugins →

flow

claudecodex

Generic agentic workflow loop for Claude Code and Codex — 10 commands: /flow:plan (--prd) → /flow:execute (--quick) → /flow:validate (--fast, --security, --a11y, --visual, --review, --scenario) → /flow:done, plus /flow:run (a plan as a goal, opt-in capped Stop hook), /flow:bug-rca, /flow:bug-fix, /flow:release (--changelog), /flow:record-ddr and /flow:init (--context, --map, --kgai). Role agents worker/spike/scout keep contexts small (skill context-budget). Project-agnostic via <project> placeholders + per-repo .ai/workflows.config.json. Use `maude init` to scaffold the .ai/ skeleton.

24 skills · 10 commands · 16 agents · hooks

3

design-video

claudecodex

Opt-in video for the design plugin (install design first): /design-video:reel cuts a folder of raw clips into a directed reel, /design-video:video-analyze reads a clip's picture and sound, /design-video:to-lottie exports an animation to one .lottie; skills video-comp, footage-director, footage-keyframes, video-generation. The Maude desktop app's AI chat already includes it.

7 skills · 3 commands · 2 agents

3

Similar plugins

Collection of example skills demonstrating various capabilities including skill creation, MCP building, visual design, algorithmic art, internal communications, web testing, artifact building, Slack GIFs, and theme styling

19 skills

anthropics/skills 193,780

Comprehensive PR review agents specializing in comments, tests, error handling, type design, code quality, and code simplification

1 command · 6 agents

anthropics/claude-code 155,476

Professional UI/UX design intelligence for AI coding assistants. Includes searchable databases of styles, colors, typography, charts, and UX guidelines for React, Next.js, Astro, Vue, Nuxt.js, Nuxt UI, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui, Jetpack Compose, Angular, Laravel, JavaFX, and Three.js.

7 skills

nextlevelbuilder/ui-ux-pro-max-skill 148,759

Taste Skill

claudecodex

tasteskill 2.5.1: professional company websites at the figma.com and x.ai level, with one section per screen, real photographs, real product UI, effects kept for tech and gaming pages, and a real-browser checker and finish gate.

1 skill

Leonxlnx/taste-skill 114,391

diagram-design

claudecodex

Editorial diagrams in your brand, as self-contained HTML and SVG. Architecture, flowcharts, sequence, state machines, ER and database schemas, timelines, swimlanes, org charts, Gantt, Wardley maps, user journeys, service blueprints, UML class, lifecycle phase maps, and charts from bar, line and scatter to Sankey, treemap and heatmap, plus many more. Redraws draw.io, Mermaid, Excalidraw and PlantUML files. Exports SVG and PNG.

1 skill · 7 commands

cathrynlavery/diagram-design 66,757

daisyui

claudecodex

daisyUI component library skill

7 skills

saadeghi/daisyui 42,821

Maintain design?

This page updates itself from your repo. Add the badge to your README, or get it Featured to pin it above the organic results with a followed link to your site.

claude & codex plugins3 plugins