skills.rest
haxlys
haxlysCOMMUNITY
Explore all skills by this author →
GitHub

ui-ux-pro-max

Generate design systems and UI components with style and color recommendations.

Updated Jun 8, 2026
Search Tags:#design system#color palette#ui component#ui/ux design#font pairing
One-click install
npx skills add https://github.com/haxlys/frontend-lab --skill ui-ux-pro-max-haxlys
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/haxlys/frontend-lab/tree/main/experiments/02-model-comparison/output/uiux-t1-r1/.agents/skills/ui-ux-pro-max-skill
Command: npx skills add https://github.com/haxlys/frontend-lab --skill ui-ux-pro-max-haxlys

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires python, ui-reasoning.csv, and includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill addresses the challenge of designing and optimizing user interfaces and experiences, providing comprehensive guidelines and tools for both new and existing projects.

Core Features & Use Cases

  • Design System Generation: Automatically generate a comprehensive design system based on product type, industry, and style keywords.
  • UI Component Creation: Assist in creating UI components like buttons, modals, and forms following best practices.
  • Style and Color Recommendations: Provide recommendations for color palettes, typography, and design styles.
  • Review and Optimization: Offer a checklist for reviewing existing UI for issues like accessibility, performance, and visual consistency.
  • Use Case: For a fintech app, the Skill can automatically generate a design system, create a pricing card component, and provide color and font recommendations.

Quick Start

Generate a design system for a new project with the ui-ux-pro-max skill by running the following command:

python3 skills/ui-ux-pro-max/scripts/search.py "beauty spa wellness service" --design-system -p "Serenity Spa"

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 for a new product?▼

Generate a design system by running the Python script with product type, industry, and style keywords to output comprehensive UI component guidelines and color palettes.

Can I get color palette and font pairing recommendations for a specific industry?▼

Yes, provide industry and style keywords to the script to receive tailored color palette, typography, and font pairing recommendations for your specific domain.

Do I need a Python environment to create UI components with this tool?▼

Yes, executing the UI component generation scripts requires a Python environment with specific libraries installed to process the ui-reasoning.csv data.

What is the best way to review existing UI for accessibility and visual consistency?▼

Use the UI review checklist provided by the tool to evaluate existing interfaces, identifying accessibility, performance, and visual consistency issues based on best practices.

Does this tool work for front-end developers or is it only for designers?▼

It is intended for both front-end developers and designers in product teams, bridging the gap by providing actionable UI component code and design system guidelines.

Can I create a pricing card component for a fintech app using this skill?▼

Yes, you can create UI components like pricing cards for a fintech app by running the search script with your service keywords and design system flags.

Related Skills

Explore More Design & Creative Skills→
mklozmkloz

ui-ux-pro-max

Generate design systems and UI/UX guidance using Python and ui-reasoning.csv.

Community
Advanced
JaiminVadadoriyaJaiminVadadoriya
1

ui-ux-pro-max

Review UI/UX designs for web and mobile interfaces across front-end frameworks.

Community
Advanced
PeterHddPeterHdd
27

cleanui

Improve AI-generated user interfaces with design best practices and layout intelligence.

Community
Advanced
I-OnlabsI-Onlabs
3

senior-frontend

Scaffold React components and analyze bundles in Next.js projects.

Community
Advanced