ui-ux-pro-max

Provides UI/UX design guidance with styles, palettes, font pairings, and charts for React and other stacks.

3|Updated Nov 11, 2025
One-click install
npx skills add https://github.com/xingranya/CervixDetectAI --skill ui-ux-pro-max-xingranya
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/xingranya/CervixDetectAI/tree/main/.agent/skills/ui-ux-pro-max
Command: npx skills add https://github.com/xingranya/CervixDetectAI --skill ui-ux-pro-max-xingranya

SYSTEM DOCUMENTATION & REQUIREMENTS

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

What problem does it solve?

This Skill provides comprehensive guidance and resources for designing and implementing user interfaces and user experiences across various platforms and stacks, ensuring professional and effective digital products.

Core Features & Use Cases

  • Design System Components: Access to 50+ UI styles, 21 color palettes, 50 font pairings, and 20 chart types.
  • Stack-Specific Best Practices: Tailored advice for React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, and HTML/Tailwind.
  • UX Guidelines: Detailed best practices for accessibility, animation, layout, and interaction.
  • Use Case: A developer needs to create a professional-looking dashboard for a SaaS product using React. This Skill can provide recommended color palettes, font pairings, chart types, and specific React implementation tips to ensure a cohesive and user-friendly design.

Quick Start

Use the ui-ux-pro-max skill to get design recommendations for a professional SaaS dashboard using React.

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 create a professional UI for a SaaS dashboard using React?

To create a professional UI for a SaaS dashboard using React, you can access recommended color palettes, font pairings, and chart types. This provides specific React implementation tips to ensure a cohesive and user-friendly design.

What are the best practices for accessibility and UX layout in frontend development?

Best practices for accessibility and UX layout include following detailed guidelines for animation, layout, and interaction. This ensures your user interfaces meet professional accessibility standards across web and mobile platforms.

Can I use this design system guidance for mobile development frameworks like Flutter and SwiftUI?

Yes, you can use this design system guidance for mobile development with frameworks like Flutter and SwiftUI. It provides stack-specific best practices tailored for these platforms alongside React Native.

How do I choose the right color palette and font pairing for a web interface?

To choose the right color palette and font pairing for a web interface, you can select from 21 color palettes and 50 font pairings. This provides comprehensive design intelligence for modern UIs.

Does this UI/UX design intelligence work with Tailwind CSS and Next.js?

Yes, this UI/UX design intelligence works with Tailwind CSS and Next.js. It delivers tailored advice and stack-specific best practices for HTML/Tailwind and Next.js implementations.

What types of charts and UI styles are available for data visualization design?

For data visualization design, 20 chart types and 50+ UI styles are available. This facilitates the implementation and optimization of user interfaces for various project types and elements.