design MCP Server
A production-grade engineering toolkit for AI-assisted software development. Contains 168 specialized skill workflows (100 core + 68 GSD sub-skills), 142 expert agent personas, 24 design system specifications, 5 reference checklists, 84 slash commands, and 9 MCP server integrations.
Discovered via github-topic:mcp and last synced 2mo ago.
Install instructions not detected yet
Check the source repository for the latest setup steps.
Red-Green-Refactor with test pyramid
React/Next.js performance optimization
Container queries, fluid typography, grid
Create detailed implementation plans
Behavioral guidelines to reduce LLM coding mistakes
React animations (Framer Motion / Motion)
Decompose specs into verifiable tasks
Execute plans with independent sub-agents
React animations with Motion (bundle-optimized)
Comprehensive web quality audit
Expo Router native app development
Async Python APIs with FastAPI + Pydantic V2
ORM queries, mutations, relations, schema
Workers, Pages, D1, R2, KV, AI, Agents SDK
Handle feedback with technical rigor
Reason
Overlapped with `docs-writing` (both Diátaxis-based). Consolidated into the more comprehensive `docs-writing` skill which has 52 rules across 9 categories.
Spreadsheet creation, editing, data cleaning
Internal communications writing
Modern ES2023+ JavaScript patterns
Isolated workspace for feature work
Get Shit Done project management (68 sub-skills)
Web crawling
Ground decisions in official documentation
Component management for shadcn/ui
UI code review against design best practices
WCAG 2.2 audit and compliance
What it is
Execute written plans with checkpoints
GSAP animation reference and patterns
Scroll-triggered animations and parallax
Express/Fastify middleware, auth, API design
Complex joins, window functions, indexing
Build tool config, plugin API, SSR, Rolldown
Modern web development best practices
Interactive 3D scenes, materials, lighting
Flowcharts, sequence diagrams, C4 architecture
The *who*
Thin vertical slices with feature flags
File conventions, RSC boundaries, data patterns
Tailwind CSS design tokens and component libraries
Critique, polish, and improve frontend interfaces
2024-2025 design trends and implementation
Build with 1400+ shadcn/ui components
50+ styles, 161 color palettes, 57 font pairings
Design-system driven by specification files
React Native and Expo mobile development
Material-UI v7 component patterns
Node.js development principles and decision-making
Overlapped with `sql-pro` which already covers query optimization, EXPLAIN analysis, and indexing strategies more comprehensively.
JavaScript Code node patterns for n8n workflows
Shopify themes, apps, and Storefront API
Serverless Postgres with Neon
Structured bug investigation
Multi-agent parallel code review
Production-ready Express.js servers
NestJS architecture and DI patterns
Postgres performance from Supabase
Schema design, migrations, query optimization
Multi-stage builds, orchestration, security hardening
Get quality feedback before merge
Migrate Next.js projects to vinext (Vite-based)
Measure-first Core Web Vitals improvement
Synthesize design systems into DESIGN.md files
Product discovery and requirements analysis
Run commands before claiming success
Playwright CLI automation, testing, and session management
Diataxis framework, Stripe-style clarity
PowerPoint deck creation and editing
Optimize LCP, INP, CLS
Three.js, React Three Fiber, Spline, WebGL
Structured workflow for co-authoring docs
PDF read, merge, split, OCR, form filling
Generics, conditional types, mapped types
Docstrings, OpenAPI specs, JSDoc, doc sites
Word document generation and manipulation
Behavioral science applied to marketing
Styling artifacts with pre-set themes
Diagnose SEO issues on websites
Retrieve up-to-date library docs
Ultra-compressed communication mode
Sales collateral, pitch decks, demo scripts
Work accomplishments reports and self-reviews
Web search without API keys
Figma to React component conversion
Profile and optimize Python code
Discover skills for specific tasks
Run independent tasks concurrently
Vercel deployment
Visual art in .png and .pdf documents
Browser automation for AI agents
Guide completion of dev work
Purpose
Generative art and creative coding with p5.js
Search engine visibility optimization
Build MCP server integrations
Find and use skills effectively
Reverse-engineer and clone websites from URLs
Agents
Interview user about a plan or design
Status
--- ## MCP Server Integration The system connects to 9 external tools via Model Context Protocol (`mcps/mcp.json`):
TypeScript language server
Explore intent and requirements before implementation
Generate structured task breakdown CSVs from features/epics
Minimalistic coding approach - lazy senior dev philosophy
Next.js 14+ App Router, RSC, Server Actions
React Native performance and best practices
Schema design, migrations, query optimization, relations
Deep multi-agent code review across codebase
Generate wiki docs + Mermaid diagrams for codebase
Remove AI writing patterns, make text sound natural
B2B cold emails and follow-up sequences that get replies
Guidance for distinctive, intentional visual design for UI
Anti-slop frontend skill for landing pages, portfolios, and redesigns
Language-specific coding standards for 18 languages
Transform vague UI ideas into polished prompts
Build new skills with evaluation
142 expert agent personas across 23 categories
Purpose
Empty skill directory with no SKILL.md — never had content.
Design de produto nivel Apple — sistemas visuais, UX flows, acessibilidade, linguagem visual proprietaria, design tokens, prototipagem e handoff. Cobre Figma, design systems, tipografia, cor, espacamento, motion design e principios de design cognitivo.
Generate or edit raster images when the task benefits from AI-created bitmap visuals such as photos, illustrations, textures, sprites, mockups, UI mockups, product shots, or transparent-background cutouts. Use when the result should be an image asset rather than repo-native SVG, HTML/CSS, or canvas.
Challenges hacky fixes on non-trivial changes.
Apply UI design principles from Refactoring UI by Adam Wathan & Steve Schoger. Covers visual hierarchy (size, weight, color, spacing), layout systems (spacing scales, grids), typography (type scales, line-height, alignment), color (HSL palettes, shade systems, accessible contrast), depth (shadow elevation, overlap), images (text on images, user content, icons), and finishing touches (accent borders, empty states, fewer borders). Trigger on "UI design", "visual hierarchy", "spacing system", "type scale", "color palette", "shadow", "layout", "design system", "component design", "card design", "form design", "button design", "refactoring UI", "design tokens", "dark mode", "responsive design".
Run Claude Design locally as an Agent Skill — Cursor, Claude Code & more. Produce polished UI mockups, prototypes, decks & wireframes as self-contained HTML, without claude.ai/design. Best with Opus or Claude.
Design engineering skill for AI Agents — build interfaces with craft-level quality
Learn how to use the absolute-spec Claude skill. Complete guide with installation instructions and examples.
Learn how to use the oasis-design-system Claude skill. Complete guide with installation instructions and examples.
Learn how to use the Typography Advisor Claude skill. Complete guide with installation instructions and examples.