skills.rest
atthawat-cha
atthawat-chaCOMMUNITY
Explore all skills by this author →
GitHub

ui-ux-pro-max

Generate design systems with UI/UX guidelines across 10 technology stacks.

Updated Feb 10, 2026
Search Tags:#best practices#performance#accessibility#design system#ui/ux design
One-click install
npx skills add https://github.com/atthawat-cha/next_rfs_report_finder_system --skill ui-ux-pro-max-atthawat-cha
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/atthawat-cha/next_rfs_report_finder_system/tree/main/.agents/skills/ui-ux-pro-max
Command: npx skills add https://github.com/atthawat-cha/next_rfs_report_finder_system --skill ui-ux-pro-max-atthawat-cha

SYSTEM DOCUMENTATION & REQUIREMENTS

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

What problem does it solve?

This Skill addresses the challenges of designing high-quality UI/UX for web and mobile applications, providing a comprehensive set of guidelines and best practices to ensure accessibility, performance, and aesthetic appeal.

Core Features & Use Cases

  • Comprehensive Design Guide: Offers 50+ styles, 161 color palettes, 57 font pairings, and more across 10 technology stacks.
  • Actionable Recommendations: Provides priority-based recommendations for UI/UX design decisions.
  • Use Case: When designing a new landing page, this Skill can help you choose the right color palette, typography, and layout that aligns with your brand and user needs.

Quick Start

Use the ui-ux-pro-max skill to generate a design system for a new project named '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 web project?▼

To generate a design system, use this Skill to access color palettes, font pairings, and layout guidelines. It provides priority-based recommendations to ensure your web project maintains aesthetic appeal and accessibility.

What are the best practices for ensuring accessibility in UI/UX design?▼

Accessibility best practices involve applying comprehensive UI/UX guidelines across multiple technology stacks. This Skill provides actionable, priority-based recommendations to help meet accessibility standards during the design process.

Does this UI/UX design guideline tool require Python?▼

Yes, Python is required as a dependency to run the specific scripts needed for design system generation. You must have the Python environment configured to execute the Skill's internal components.

Can I find color palettes and font pairings for different technology stacks?▼

Yes, you can find 161 color palettes and 57 font pairings covering 10 different technology stacks. These resources help align your design decisions with brand needs and user expectations.

What is the best way to optimize landing page performance through UI/UX design?▼

Optimizing landing page performance requires applying comprehensive UI/UX guidelines that focus on both performance and aesthetic quality. This Skill offers actionable recommendations to balance visual appeal with technical efficiency.

Are there limitations to using pre-defined UI/UX styles for mobile applications?▼

While the Skill offers 50+ styles across 10 stacks, limitations arise if your mobile application requires highly customized aesthetics outside these predefined parameters. You may need manual adjustments for specialized design needs.

Related Skills

Explore More Design & Creative Skills→
diegoscarabellidiegoscarabelli
9

system2-onboarding

Automate local data engineering setup with PostgreSQL, Python, and orchestrators.

Community
Advanced
veerababumanyamveerababumanyam

frontend-design

Generate production-grade frontend interfaces with design-system tokens and reusable components.

Community
Basic
HopeArtOrgHopeArtOrg
8

ui-ux-pro-max

Provide UI/UX design recommendations for web and mobile applications.

Official
Advanced
DiologIRDiologIR

presentation-design-md-from-screenshots

Extract visual design specifications from slide screenshots into a PRESENTATION_DESIGN.md file.

Official
Advanced