skills.rest
ak125
ak125COMMUNITY
Explore all skills by this author →
GitHub

ui-ux-pro-max

Generate design systems and audit UI accessibility against WCAG standards.

1|Updated Nov 12, 2024
Search Tags:#typography#accessibility#design system#ui/ux#color palette#component audit
One-click install
npx skills add https://github.com/ak125/nestjs-remix-monorepo --skill ui-ux-pro-max-ak125
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/ak125/nestjs-remix-monorepo/tree/main/.claude/skills/ui-ux-pro-max
Command: npx skills add https://github.com/ak125/nestjs-remix-monorepo --skill ui-ux-pro-max-ak125

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires python3, and includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill provides comprehensive UI/UX design intelligence, helping users create visually appealing, accessible, and user-friendly interfaces by offering guidance on styles, palettes, typography, and best practices.

Core Features & Use Cases

  • Design System Generation: Create complete design systems tailored to specific product types and industries.
  • Component/Page Validation: Audit existing UI elements against accessibility and design standards.
  • Use Case: When designing a new e-commerce product page, use this Skill to generate a cohesive design system including color palettes, font pairings, and layout recommendations, then validate the implemented components for accessibility compliance.

Quick Start

Generate a design system for a new fintech dashboard.

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 a specific industry like fintech?▼

To generate a design system, this Skill tailors color palettes, font pairings, and layout recommendations to specific product types and industries, providing a cohesive foundation for your project.

What's the best way to audit UI components for WCAG accessibility compliance?▼

The best way to audit UI components is by validating them against WCAG standards. This Skill performs accessibility audits on existing elements to ensure your interface meets compliance requirements.

Can I get font pairing and color palette recommendations for mobile applications?▼

Yes, you can get recommendations for mobile applications. This Skill provides comprehensive UI/UX design intelligence covering 96 color palettes and 57 font pairings suitable for both web and mobile.

Does this design system generator support specific technology stacks?▼

Yes, the design system generator supports 13 specific technology stacks. It provides tailored UI/UX design intelligence to align your interface components with your chosen development framework.

Do I need Python to run accessibility audits and component validations?▼

Yes, you need Python3 installed. This dependency is required to run the scripts and references that perform accessibility audits and validate your UI components against design standards.

How do I choose the right UI style from available design options?▼

To choose the right UI style, this Skill offers searchable guidance across 67 distinct styles. You can search and compare options to find the visual approach that fits your application.

Related Skills

Explore More Design & Creative Skills→
BaoNguyen09BaoNguyen09
6

install-mac

Install Node.js and project dependencies on macOS for development.

Community
Intermediate
v1nizxv1nizx

stitch::extract-design-md

Extract color palettes, typography scales, and component styling patterns from frontend source code.

Community
Advanced
abzhawabzhaw

data-visualization

Render real-time charts of agent activity and data trends on Julia's dashboard.

Community
Intermediate
TarasTsavolykTarasTsavolyk
1

a11y-audit

Audit web UI components against WCAG 2.2 AA standards using axe and manual checks.

Community
Intermediate