ui-ux-pro-max

Create UI/UX design systems with tokens, accessibility, and documentation for web and mobile.

264|11|Updated Apr 25, 2026
One-click install
npx skills add https://github.com/rkz91/coco --skill ui-ux-pro-max-rkz91
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/rkz91/coco/tree/main/skills/ui-ux-pro-max
Command: npx skills add https://github.com/rkz91/coco --skill ui-ux-pro-max-rkz91

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

This Skill provides a scalable framework for planning, designing, and implementing UI/UX systems across web and mobile projects, reducing design debt and accelerating delivery.

Core Features & Use Cases

  • Comprehensive design guidance: typography, color systems, component catalog, accessibility, and responsive best practices.
  • Design-to-development workflow: generate tokens, design system documentation, and component usage patterns for React, Vue, Next.js, Flutter, and native platforms.
  • Use Case: Build a cohesive design language for dashboards and marketing sites that scales with product growth.

Quick Start

Provide a complete UI/UX design system blueprint for a SaaS dashboard, including components, tokens, and accessibility guidelines.

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 create a scalable UI UX design system for a SaaS dashboard?

A scalable UI UX design system for a SaaS dashboard requires comprehensive typography, color systems, and component catalogs. You generate design tokens, accessibility guidelines, and documentation to bridge design and development workflows across web and mobile platforms.

What is included in a comprehensive UI UX design system blueprint?

A comprehensive UI UX design system blueprint includes typography, color systems, responsive layouts, and component usage patterns. It provides design tokens, accessibility best practices, and validation criteria to guide teams building websites, dashboards, and mobile applications.

Can I generate design tokens and documentation for React, Vue, and Next.js projects?

Yes, you can generate design tokens and documentation for React, Vue, and Next.js projects. The system provides component usage patterns and explicit validation criteria that integrate directly into these frameworks to accelerate development and reduce design debt.

Does this design system guidance support mobile frameworks like Flutter and SwiftUI?

Yes, this design system guidance supports mobile frameworks like Flutter and SwiftUI. It applies to mobile projects by providing native component patterns, responsive layouts, and shared design tokens to ensure cross-platform UI consistency.

What is the best way to ensure accessibility in a UI UX design system?

The best way to ensure accessibility in a UI UX design system is to integrate explicit validation criteria and best practices directly into your component guidelines. This covers responsive layouts, color systems, and typography to meet accessibility standards across web and mobile applications.

How do I reduce design debt when building marketing sites and apps?

To reduce design debt when building marketing sites and apps, implement a unified design language with shared tokens and component catalogs. This scalable framework ensures consistent UI UX implementation across teams, reducing fragmentation and accelerating product delivery.