skills.rest
MiDouTech
MiDouTechOFFICIAL
Explore all skills by this author →
GitHub

ui-ux-pro-max

Generate searchable design systems and UX guidelines for web and mobile interfaces.

Updated Mar 30, 2026
Search Tags:#typography#accessibility#tailwind#design-system#color-palette#ux-guidelines
One-click install
npx skills add https://github.com/MiDouTech/myTapd --skill ui-ux-pro-max-midoutech
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/MiDouTech/myTapd/tree/main/.claude/skills/ui-ux-pro-max
Command: npx skills add https://github.com/MiDouTech/myTapd --skill ui-ux-pro-max-midoutech

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

It removes guesswork and inconsistency from product interfaces by providing a searchable design system, prioritized UX rules, and implementation guidance so teams can quickly produce accessible, consistent, and production-ready UI across web and mobile.

Core Features & Use Cases

  • Searchable style, color, typography, and UX guideline database for fast decision-making.
  • Automated design system generator that combines product, style, color, typography, landing, and stack-specific recommendations.
  • Stack-aware implementation notes (html-tailwind, react, vue, svelte, shadcn, etc.) and persistence support for MASTER + page override patterns.
  • Use case: create a consistent SaaS dashboard design system, export MASTER documentation, and produce page overrides for a checkout or dashboard page.

Quick Start

Generate a design system for a SaaS dashboard named Nimbus prioritizing accessibility and minimalism.

Frequently Asked Questions about ui-ux-pro-max

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

FAQPage Schema
How do I generate a consistent design system for a web or mobile interface?▼

Generate a comprehensive design system by combining product, style, color, and typography guidelines to eliminate inconsistent styling. It outputs color palettes, typography pairings, and component specs for consistent web and mobile interfaces.

How do I ensure my UI components meet accessibility guidelines?▼

Ensure UI components meet accessibility guidelines by applying automated accessibility checks during the design system generation process. This identifies and resolves accessibility gaps before producing component specs for web and mobile interfaces.

Does this design system generator work with Tailwind and React?▼

Yes, the design system generator works with Tailwind and React by providing stack-aware implementation notes. It supports frameworks including html-tailwind, react, vue, svelte, and shadcn to deliver stack-specific implementation guidance.

What is the best way to maintain design consistency across a SaaS dashboard?▼

Maintain design consistency across a SaaS dashboard by generating a searchable design system and persisting a MASTER documentation file. This stores prioritized UX rules and page-level overrides for components like checkout or dashboard pages.

Can I export a MASTER file and apply page overrides for a specific landing page?▼

Yes, you can export a MASTER file and apply page overrides for a specific landing page. The system optionally persists a MASTER file with page-level overrides to maintain consistent styling while addressing unique page requirements.

Why do I need stack-specific implementation guidance for my design system?▼

You need stack-specific implementation guidance for your design system to ensure accurate component specs translate into usable code. It provides tailored implementation notes for frameworks like vue, svelte, and shadcn, reducing development friction.

Related Skills

Explore More Design & Creative Skills→
RuzenieRuzenie
2

requirements-elicitation-engine

Clarify ambiguous project requirements and generate a draft PRD, questions, and style profile.

Community
Intermediate
hookvibehookvibe
3

ui-ux-pro-max

Generate UI/UX design systems with color palettes and typography guidelines.

Official
Basic
LimaTechnologiesLimaTechnologies

shadcn-ui

Implement shadcn/ui components in React and Next.js projects.

Community
Advanced
jabez4jcjabez4jc

ui-ux-pro-max

Generate design systems with styles, palettes, typography, and UX guidelines.

Community
Advanced