skills.rest
CarbeneAI
CarbeneAICOMMUNITY
Explore all skills by this author →
Website𝕏@CarbeneAIGitHub

ui-ux-pro-max

Provides WCAG 2.1 AA/AAA compliant web and mobile UI/UX design guidance with Tailwind-ready implementation patterns.

9|1|Updated Apr 16, 2026
Search Tags:#accessibility#react#components#tailwind#ui-ux#design-system#color-palette
One-click install
npx skills add https://github.com/CarbeneAI/Forge --skill ui-ux-pro-max-carbeneai
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/CarbeneAI/Forge/tree/main/.claude/skills/ui-ux-pro-max
Command: npx skills add https://github.com/CarbeneAI/Forge --skill ui-ux-pro-max-carbeneai

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

UI/UX Pro Max removes uncertainty and repetitive decision-making from interface design by providing an expert, searchable knowledge base and implementation-ready patterns for web and mobile projects. It reduces design review cycles, enforces accessibility and performance best practices, and produces stack-specific guidance so teams can ship consistent, production-quality UI faster.

Core Features & Use Cases

  • Comprehensive Design Knowledge: 50+ design styles, 97 color palettes, 57 font pairings, and 25 chart patterns mapped to product types (SaaS, e‑commerce, healthcare, fintech, dashboards).
  • Accessibility-First Rules: WCAG 2.1 AA/AAA checks, color contrast, focus states, keyboard navigation, and reduced-motion support baked into recommendations.
  • Stack-Specific Implementation: Tailwind/html, React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, shadcn/ui patterns and code-ready examples.
  • Search & Generators: CLI search tool and design-system generator for creating MASTER + page override files, persisting hierarchical design systems across projects.
  • Deliverables: Ready-to-use CTA sections, promo tokens, implementation guides, and production HTML/CSS examples for quick integration.

Quick Start

Ask UI/UX Pro Max to generate a complete design system and Tailwind-ready component code for a SaaS dashboard that meets WCAG AA accessibility standards.

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 design system with WCAG 2.1 AA accessibility for a SaaS dashboard?▼

To generate a WCAG 2.1 AA accessible design system for a SaaS dashboard, you can use expert UI/UX guidance to produce stack-specific patterns, color palettes, and typography pairings. This process ensures your interface meets strict accessibility and performance standards.

Can I get Tailwind-ready React components that follow UI/UX best practices?▼

Yes, you can generate Tailwind-ready React components that follow UI/UX best practices. The system provides stack-specific implementation guidance and production-ready code examples for frameworks including React, Vue, Svelte, and Tailwind/html.

What's the best way to ensure color contrast and keyboard navigation meet accessibility standards?▼

The best way to ensure color contrast and keyboard navigation meet accessibility standards is by applying automated WCAG 2.1 AA/AAA checks to your design. This enforces focus states, contrast ratios, and reduced-motion support directly within your recommendations.

Does this UI/UX guidance support mobile app development frameworks like SwiftUI and Flutter?▼

Yes, this UI/UX guidance supports mobile app development frameworks like SwiftUI, Flutter, and React Native. It delivers actionable recommendations and component-ready implementation patterns for both web and mobile interfaces.

How do I create a color palette and typography pairing for a fintech product?▼

You can create a color palette and typography pairing for a fintech product by leveraging a comprehensive design knowledge base. It maps 97 color palettes and 57 font pairings to specific product types like fintech, e-commerce, and healthcare.

Why does my web interface design review take so many cycles to finalize?▼

Web interface design reviews take many cycles due to repetitive decision-making and inconsistent accessibility enforcement. By applying an expert knowledge base with stack-specific patterns, you can reduce review cycles and ship production-quality UI faster.

Related Skills

Explore More Design & Creative Skills→
somachaksomachak

modern-css-architecture

Standardize design tokens and component styling patterns for Tailwind-based React projects.

Community
Intermediate
joshkellett87joshkellett87

frontend-ui-ux

Convert designer briefs into HTML/CSS/JS frontend prototypes.

Community
Advanced
ever-worksever-works
21

shadcn

Manage shadcn UI components and generate source code from project configurations.

Official
Intermediate
Exia-thdExia-thd

ui-designer

Generate WCAG AA-compliant wireframes, design tokens, and component inventories for digital products.

Community
Advanced