skills.rest
Hans3010
Hans3010COMMUNITY
Explore all skills by this author →
GitHub

ui-ux-pro-max

Generate design systems with styles, palettes, and font pairings for web and mobile apps.

Updated Mar 1, 2026
Search Tags:#typography#accessibility#design system#ui/ux#web design#front-end development#mobile app design
One-click install
npx skills add https://github.com/Hans3010/Hanstec-Automate --skill ui-ux-pro-max-hans3010
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/Hans3010/Hanstec-Automate/tree/main/.agents/skills/ui-ux-pro-max
Command: npx skills add https://github.com/Hans3010/Hanstec-Automate --skill ui-ux-pro-max-hans3010

SYSTEM DOCUMENTATION & REQUIREMENTS

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

What problem does it solve?

This Skill provides comprehensive UI/UX design intelligence, offering a vast library of styles, palettes, font pairings, and UX guidelines to create professional and user-friendly interfaces for web and mobile applications.

Core Features & Use Cases

  • Design System Generation: Creates detailed design systems based on product type, industry, and desired style.
  • UX Best Practices: Offers guidelines on accessibility, interaction, performance, and layout.
  • Stack-Specific Advice: Provides implementation details for various technology stacks like React, Next.js, Vue, and more.
  • Use Case: When designing a new e-commerce website, use this Skill to generate a design system that includes a modern color palette, elegant typography, and best practices for product display and checkout flows.

Quick Start

Use the ui-ux-pro-max skill to generate a design system for a new SaaS 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 design system for a web or mobile application?▼

To generate a design system, you define the product type, industry, and desired style to receive a detailed framework covering color palettes, font pairings, and UX guidelines for web and mobile applications. This provides a cohesive visual and interaction foundation.

What UI/UX guidelines are available for ensuring accessibility and layout performance?▼

UI/UX guidelines for accessibility and performance include specific recommendations on interaction patterns, optimal layout structures, and visual contrast. These guidelines ensure interfaces are user-friendly and meet accessibility standards across different technology stacks.

Can I get implementation guidance for front-end development stacks like React or Vue?▼

Yes, you can get implementation guidance for front-end development stacks like React, Next.js, and Vue. This provides specific code review and implementation details to translate design systems into functional interfaces.

Does this provide color palettes and typography pairings for mobile app design?▼

Yes, it provides a vast library of color palettes and typography pairings specifically tailored for mobile app design. This ensures visual consistency and readability across different device screens and application types.

What is the best way to design a SaaS dashboard interface?▼

The best way to design a SaaS dashboard interface is by generating a comprehensive design system that includes modern color schemes, readable typography, and best practices for data visualization and layout performance.

Related Skills

Explore More Design & Creative Skills→
rafael-hcrafael-hc

frontend-blueprint

Guide UI discovery and generate atomic HTML/CSS components.

Community
Advanced
callwebboss-bitcallwebboss-bit

frontend-design

Create production-grade frontend interfaces with typography, motion, and accessibility guidelines.

Community
Advanced
OpenCovenOpenCoven
20

dataviz-dashboard-ux

Guide chart type selection and dashboard design for accessible React visualizations.

Official
Advanced
poko8nadapoko8nada

ui-design

Apply Tailwind-based design guidelines for typography, color, spacing, and components.

Community
Intermediate