skills.rest
felix-howard
felix-howardCOMMUNITY
Explore all skills by this author →
GitHub

ui-ux-pro-max

Generate design systems with styles, palettes, fonts, and chart types.

Updated Jan 11, 2026
Search Tags:#accessibility#design system#ui/ux#style guide#component library#tailwind css#frontend development
One-click install
npx skills add https://github.com/felix-howard/ella --skill ui-ux-pro-max-felix-howard
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/felix-howard/ella/tree/main/.claude/skills/ui-ux-pro-max
Command: npx skills add https://github.com/felix-howard/ella --skill ui-ux-pro-max-felix-howard

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires csv, re, pathlib, math, collections, json, os, datetime, and includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill provides comprehensive UI/UX design intelligence, offering best practices, style recommendations, and implementation guidelines across various technology stacks to ensure visually appealing and user-friendly interfaces.

Core Features & Use Cases

  • Design System Generation: Creates detailed design systems based on project requirements, including patterns, styles, colors, and typography.
  • Stack-Specific Guidelines: Offers tailored advice for implementing designs in frameworks like React, Vue, Next.js, and more.
  • Use Case: When starting a new SaaS dashboard project, use this Skill to generate a complete design system, select an appropriate style (e.g., "glassmorphism"), define a color palette, choose font pairings, and get specific UX guidelines for accessibility and interaction.

Quick Start

Use the ui-ux-pro-max skill to generate a design system for a 'fintech mobile app' project.

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 new project?▼

You can generate a design system by providing your project requirements, which the tool uses to output tailored UI/UX patterns, color palettes, font pairings, and accessibility guidelines.

Can I get UI/UX design guidelines for specific frontend stacks like React and Next.js?▼

Yes, the tool offers stack-specific UI/UX guidelines across 13 technology stacks including React, Vue, and Next.js to help implement tailored design patterns and components.

Does this tool integrate with shadcn/ui for component search?▼

Yes, this tool integrates with shadcn/ui to search for component examples, helping you implement specific UI elements within your design system.

What is the best way to choose a color palette and font pairing for a SaaS dashboard?▼

The best way is to use the built-in design intelligence, which recommends from 96 color palettes and 57 font pairings to match your chosen style, such as glassmorphism for SaaS dashboards.

How do I ensure my UI design meets accessibility standards?▼

You can ensure accessibility by using the specific UX guidelines for accessibility and interaction provided within the generated design system.

Related Skills

Explore More Design & Creative Skills→
Nuwanda04Nuwanda04

senior-frontend

Scaffold React and Next.js projects with TypeScript and Tailwind CSS.

Community
Advanced
marius4luimarius4lui
1

ui-ux-pro-max

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

Community
Advanced
timothyfroehlichtimothyfroehlich

pinpoint-ui

Create accessible shadcn/ui interfaces with Tailwind CSS v4 patterns.

Community
Basic
HCMUTE-RTICHCMUTE-RTIC

ui-ux-pro-max

Generate design systems with style, color, typography, and stack-specific guidelines.

Official
Advanced