claude

design-utilities

Bundle of small design-utility MCP wrappers: a11y-audit (WCAG/ARIA), color (contrast, palette, blindness sim), design-token (CSS/Tailwind/Style Dictionary export), image-processing (lossy/lossless optimization), typography (modular type scales).

3 on GitHubby Standard Beaglev0.2.2MITupdated 5 days ago
/

Plugin design-utilities from marketplace standardbeagle-tools in standardbeagle/standardbeagle-tools. Commands read from the repo's manifest — 4 days ago.

What it installs

Skills (11)

  • design-utilities-a11y-audit-overview

    Overview of a11y-audit MCP server tools for static accessibility analysis - HTML audits, WCAG scoring, heading outlines, ARIA validation, link text checks, and PDF accessibility inspection without browser.

  • design-utilities-a11y-audit-quick-start

    Quick reference for a11y-audit MCP server - audit_html, wcag_score, heading_structure, aria_validate, link_text_check, document_accessibility. Use when auditing HTML or PDF content for WCAG conformance without browser, verifying ARIA usage, checking heading outlines, or vetting link text quality in

  • design-utilities-color-overview

    Overview of color MCP server tools for precise color operations - WCAG contrast, color blindness simulation, palette extraction, color space conversion, and harmony generation.

  • design-utilities-color-quick-start

    Quick reference for color MCP server - contrast_check, color_blindness_simulate, palette_extract, color_convert, harmony_generate. Use when working on accessibility verification, palette design, color space conversion, or generating harmonious color schemes.

  • design-utilities-design-token-overview

    Overview of design-token MCP server tools for design system token management - generate, export (CSS/Tailwind/Style Dictionary/SCSS/JSON), validate, diff, merge theme layers, and Tailwind config generation.

  • design-utilities-design-token-quick-start

    Quick reference for design-token MCP — tokens_generate, tokens_export, tokens_validate, tokens_diff, tokens_merge, tailwind_generate. Use when: build/maintain design token pipeline, export tokens to CSS/Tailwind/SCSS/Style Dictionary, validate token files, diff token versions, layer base/brand/mode

  • design-utilities-image-processing-overview

    Overview of image-processing MCP server tools for image pipelines - lossy/lossless optimization and format conversion, responsive srcset generation, BlurHash/LQIP placeholder creation, SVG optimization via SVGO, and dominant-color palette extraction.

  • design-utilities-image-processing-quick-start

    Quick reference for image-processing MCP — image_optimize, responsive_generate, blur_hash, svg_optimize, palette_from_image. Use when: compress/convert images to WebP/AVIF, generate responsive srcset, produce BlurHash/LQIP placeholders, minify SVG, extract dominant-color palettes.

  • design-utilities-recommender

    Routes design-utilities intent to right manual skill among color, typography, design-token, image, a11y helpers — sole auto gateway; others manual. design-utilities 唯一自動網關。 Use when: color/contrast/palette, typography/font/type scale, design tokens, image optimize/responsive/blurhash, static a11y/WC

  • design-utilities-typography-overview

    Overview of typography MCP server tools for type system work - modular scale generation, font metrics extraction, variable font axis parsing, font subsetting to WOFF2, and system-fallback font stacks with size-adjust tuning.

  • design-utilities-typography-quick-start

    Quick reference for typography MCP — modular_scale, font_metrics, variable_font_axes, font_subset, font_stack. Use when: build type scale, analyze vertical metrics for line-height, inspect variable font axes, subset fonts to WOFF2, tune system-font fallback with size-adjust to avoid CLS.

View source on GitHub dev.standardbeagle.com

More from standardbeagle/standardbeagle-tools

All 24 plugins →

agnt

claude

Browser superpowers for AI coding agents: dev-server and reverse proxy with traffic logging, a deduped priority error inbox, 50+ frontend diagnostic functions, accessibility/performance/security/SEO/responsive/API/loading audits, visual-regression snapshots, replay testing, tunnels, and sketch/design modes

36 skills · 4 agents · hooks

3

dartai

claude

Dart task management with adversarial cooperation loops and full dart-query MCP schema parity - DartQL batch operations, advanced filtering, task relationships, documents, time tracking, and automated task execution through quality verification pipelines. Requires @standardbeagle/[email protected]+ (dartai_loop_snapshot tool used by /dartai:start).

29 skills · 6 agents · hooks

3

Token-efficient Figma integration with query-based data shaping, image export, design tokens, and adversarial design library extraction. Build production-ready component libraries with exact CSS, assets, HTML mockups, and comprehensive documentation using the Ralph Wiggum quality loop.

28 skills · 4 agents

3

Contextually-loaded development standards and project-aware skills. Replaces bulk CLAUDE.md instructions with on-demand rules, language-scoped guidelines, and project-type skill templates.

25 skills · hooks

3

slop-mcp

claude

SLOP (Simple Language Open Protocol) integration for MCP management. Migrate existing MCP setups, search and execute tools, manage resources, and orchestrate multiple MCP servers. Includes Dart MCP tool reference skills for reduced get_metadata calls.

23 skills · 2 agents · 1 MCP server

3

UX-driven development toolkit for building accessible, user-centered websites and applications. Integrates UX principles, accessibility verification (WCAG 2.2), Nielsen's heuristics, and usability best practices directly into the development workflow. Includes agents for comprehensive audits and component design.

20 skills · 4 agents

3

Similar plugins

claude-mem

claudecodex

Persistent memory for Claude Code: the next session starts where the last one left off.

29 skills · 1 MCP server · hooks

thedotmack/claude-mem 116,618

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

context7

claudecodex

Up-to-date documentation lookup. Pull version-specific documentation and code examples directly from source repositories into your coding agent's context.

1 MCP server

upstash/context7 64,709

mempalace

claudecodex

AI memory system — mine projects and conversations into a searchable palace. 47 MCP tools, auto-save hooks, guided setup.

3 skills · 6 commands · 1 MCP server · hooks

MemPalace/mempalace 60,536

Reliable automation, in-depth debugging, and performance analysis in Chrome using Chrome DevTools and Puppeteer

8 skills · 1 MCP server

ChromeDevTools/chrome-devtools-mcp 55,181

Maintain design-utilities?

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 plugins24 plugins