ui-ux-pro-max

Generates design systems and reviews UI/UX patterns for accessible web and mobile interfaces.

218|33|Updated Jan 7, 2026

Search Tags:#design #accessibility #UI/UX #responsive #glassmorphism #design-system #bento-grid

Ready to run

npx skills add https://github.com/first-fluke/fullstack-starter --skill ui-ux-pro-max-first-fluke

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/first-fluke/fullstack-starter/tree/main/.agents/skills/ui-ux-pro-max
Command: npx skills add https://github.com/first-fluke/fullstack-starter --skill ui-ux-pro-max-first-fluke

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill provides professional-grade UI/UX design guidance to help teams implement modern patterns, ensure accessibility, and generate consistent design systems across web and mobile.

Core Features & Use Cases

Design System Generation: create colors, typography, spacing, and component variants for web and mobile.
Design Patterns: apply Glassmorphism, Bento Grid, Neumorphism, and dark mode with accessibility in mind.
Review & Refactor: audit for WCAG compliance, consistency, and responsive behavior.

Quick Start

Prompt the AI to generate a complete design system for a web and mobile app, including color tokens, typography, spacing, and component variants.

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 complete design system for web and mobile apps?▼

Generate a complete design system by defining color tokens, typography scales, spacing rules, and component variants. This ensures UI consistency and accelerates implementation across responsive web and mobile interfaces.

What is the best way to apply Glassmorphism and Bento Grid patterns accessibly?▼

Apply Glassmorphism and Bento Grid patterns by combining visual styling with WCAG compliance checks. This ensures modern UI trends remain accessible and readable across all responsive layouts.

How do I audit my UI components for WCAG compliance and responsive behavior?▼

Audit UI components for WCAG compliance by reviewing color contrast, semantic structure, and responsive behavior. This identifies accessibility gaps and ensures consistent rendering across mobile and web platforms.

Do I need external design tools to create and manage design tokens?▼

You do not need external design tools to create and manage design tokens. The skill generates style guides, spacing rules, and component variants directly without requiring external dependencies or plugins.