skills.rest
marius4lui
marius4luiCOMMUNITY
Explore all skills by this author →
Website𝕏@marius4luiGitHub

ui-ux-pro-max

Generate design systems and UI/UX guidance for React, Vue, Next.js, Flutter, and Tailwind CSS.

1|Updated Jan 4, 2026
Search Tags:#accessibility#react#design system#ui/ux#component library#tailwind css#frontend development
One-click install
npx skills add https://github.com/marius4lui/Classly --skill ui-ux-pro-max-marius4lui
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/marius4lui/Classly/tree/main/.agents/skills/ui-ux-pro-max
Command: npx skills add https://github.com/marius4lui/Classly --skill ui-ux-pro-max-marius4lui

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 guidance on styles, color palettes, typography, and best practices across various technology stacks to ensure visually appealing and user-friendly interfaces.

Core Features & Use Cases

  • Design System Generation: Create detailed design systems tailored to specific project types, industries, and keywords.
  • Component Styling: Get recommendations for colors, typography, and effects.
  • UX Best Practices: Access guidelines for accessibility, interaction, and performance.
  • Stack-Specific Advice: Receive implementation tips for frameworks like React, Vue, Tailwind CSS, and more.
  • Use Case: When building a new SaaS dashboard, use this Skill to generate a complete design system, including color palettes, font pairings, and layout recommendations, ensuring a professional and consistent look and feel.

Quick Start

Generate a design system for a 'fintech mobile app' using the --design-system flag.

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 React and Tailwind CSS project?▼

You can generate a Tailwind CSS design system by requesting styles, color palettes, and font pairings tailored to your project. This Skill outputs comprehensive UI guidelines and component styling recommendations for React and other stacks.

Does this UI/UX design intelligence tool support Vue and Next.js frameworks?▼

Yes, the UI/UX design intelligence supports Vue and Next.js. It delivers framework-specific implementation guidance for component styling, design system generation, and accessibility best practices across these technology stacks.

What is the best way to ensure accessibility when building a frontend component library?▼

To ensure accessibility in a component library, apply the UX best practices provided by this Skill. It offers specific guidelines for interaction, accessibility, and performance to ensure your frontend components are user-friendly and compliant.

Can I get color palette and typography recommendations for a fintech mobile app?▼

You can get color and typography recommendations for a fintech mobile app by generating a customized design system. This Skill outputs 21 palettes and 50 font pairings matched to your project's industry keywords and requirements.

How do I find shadcn/ui component examples for my dashboard design?▼

You can find shadcn/ui component examples for dashboards using this Skill's integrated search functionality. It retrieves relevant component examples and provides styling recommendations to help you build and refactor your UI.

When should I not use an automated design system generator for my UI?▼

Avoid using an automated design system generator for UI projects requiring highly bespoke, unconventional visual languages. While this Skill offers 50+ styles and 21 palettes, extremely niche branding may still require manual design adjustments.

Related Skills

Explore More Design & Creative Skills→
moshi-azzmoshi-azz
2

ui-ux-pro-max

Generate UI/UX design systems with guidelines, palettes, and typography for specified tech stacks.

Community
Advanced
Veloxia-agencyVeloxia-agency

ckm:ui-styling

Create accessible React interfaces with shadcn/ui and Tailwind CSS.

Community
Advanced
shinnytechshinnytech

using-shadcn-ui

Create React UI components with shadcn/ui and Tailwind CSS.

Official
Intermediate
SpagesticSpagestic
4

web-design-guidelines

Review UI code against Web Interface Guidelines for accessibility and UX compliance.

Community
Basic