skills.rest
wonton-web-works
wonton-web-worksOFFICIAL
Explore all skills by this author →
GitHub

mg-design

Coordinate UI/UX design direction and enforce brand-consistent visuals across products.

1|1|Updated Feb 4, 2026
Search Tags:#design#ui#accessibility#wireframes#ux#visual-regression#brand-kit
One-click install
npx skills add https://github.com/wonton-web-works/miniature-guacamole --skill mg-design
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: mg-design
Source: https://github.com/wonton-web-works/miniature-guacamole/tree/main/src/framework/skills/mg-design
Command: npx skills add https://github.com/wonton-web-works/miniature-guacamole --skill mg-design

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Coordinate UI/UX design direction and enforce brand-consistent visuals across products.

Core Features & Use Cases

  • Visually review designs for brand alignment and accessibility compliance across project features.
  • Generate design specs, tokens, and hand-off artifacts to engineering and frontend teams.
  • Use Case: When starting a new feature, produce a brand-kit-aligned design brief, wireframes, and acceptance criteria.

Quick Start

Use a design agent to generate a brand-compliant design brief based on current project constraints.

Frequently Asked Questions about mg-design

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I enforce brand-kit alignment across multiple UI features?▼

Generate design specs and handoff artifacts by visually reviewing designs for brand alignment and accessibility compliance. This workflow outputs standardized design tokens and acceptance criteria needed for frontend implementation.

What is the best way to run visual-regression reviews for UI components?▼

Produce a brand-aligned design brief by initiating the design workflow with current project constraints. Use a design agent to generate wireframes and acceptance criteria that align with the brand-kit reference for new features.

Does this design workflow support accessibility checks and design-spec handoffs?▼

No external dependencies are required to enforce brand-consistent visuals and coordinate UI/UX design direction. The workflow operates autonomously using memory-protocol routines and brand-kit references to produce design specs.

How do I generate a brand-compliant design brief for a new feature?▼

Apply the standardized design workflow to current project constraints to generate a brand-compliant design brief. This process produces wireframes and acceptance criteria aligned with the brand-kit reference.

Can I use this to coordinate UI/UX design direction without external dependencies?▼

Yes, you can coordinate UI/UX design direction without external dependencies. The workflow operates autonomously using memory-protocol routines and brand-kit references to enforce brand-consistent visuals across products.

Related Skills

Explore More Design & Creative Skills→
dawitlabsdawitlabs
3

design-grill

Interview stakeholders to generate a project-root DESIGN-BRIEF.md for UI design.

Community
Advanced
duongdevduongdev
9

figma-integration

Convert Figma designs into implementation-ready component specifications and styling guidelines.

Community
Advanced
tuanemuytuanemuy

frontend-design

Design production-grade frontend interfaces from a design brief, outputting semantic tokens, a component map, and example code.

Community
Advanced
truchottruchot
2

direction-artistique

Define visual identity, brand language, and governance for projects.

Community
Advanced