skills.rest
JiaWei-Chen-2295
JiaWei-Chen-2295COMMUNITY
Explore all skills by this author →
GitHub

ui-ux-pro-max

Generate UI/UX design systems with color, typography, and layout guidelines.

1|Updated Mar 17, 2025
Search Tags:#typography#accessibility#layout#ui-ux#design-system#color-palette#component-guidelines
One-click install
npx skills add https://github.com/JiaWei-Chen-2295/frontend-smarter-OJ --skill ui-ux-pro-max-jiawei-chen-2295
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/JiaWei-Chen-2295/frontend-smarter-OJ/tree/main/.trae/skills/ui-ux-pro-max
Command: npx skills add https://github.com/JiaWei-Chen-2295/frontend-smarter-OJ --skill ui-ux-pro-max-jiawei-chen-2295

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

UI/UX design decisions across multiple stacks and platforms are time-consuming and inconsistent without a unified system.

Core Features & Use Cases

  • 50+ styles, 97 color palettes, 57 font pairings, 99 UX guidelines, and 25 chart types across 9 technology stacks to guide planning, building, reviewing, and refining UI components and layouts.
  • Use Case: Create cohesive dashboards, landing pages, admin panels, and mobile apps with consistent typography, color, and interactions.

Quick Start

Describe a complete UI design system that matches the project goals and constraints.

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 consistent UI/UX design system for multiple frameworks like React and Svelte?▼

Generate a unified UI/UX design system by applying 50+ styles, 97 color palettes, and 57 font pairings across 9 technology stacks including React, Svelte, and Vue to ensure consistent product design decisions.

Can I create dashboard and admin panel guidelines for Tailwind and shadcn/ui?▼

Yes, you can create cohesive dashboards, landing pages, and admin panels with consistent typography, color, and interaction guidelines tailored for technology stacks like Tailwind and shadcn/ui.

What is the best way to ensure accessibility in web and mobile interface layouts?▼

Apply layout and accessibility guidelines from 99 UX rules to web and mobile interfaces, ensuring functional requirements are met across target platforms like SwiftUI, React Native, and Flutter.

Does this UI/UX design approach work for both web dashboards and mobile apps?▼

Yes, the design system generation targets websites, SaaS platforms, and mobile apps across multiple stacks, providing component guidelines, color palettes, and typography recommendations for both web and mobile interfaces.

How do I override specific color palette or typography recommendations in a generated design system?▼

Utilize the persistent Master/Overrides workflow to refine design systems by overriding specific typography or color palette recommendations while maintaining the core layout and component guidelines.

Why does my design system lack animation and performance considerations for landing pages?▼

Animation and performance considerations are explicitly included in the UI/UX design system generation to satisfy functional requirements for multi-domain retrieval across landing pages and SaaS portfolios.

Related Skills

Explore More Design & Creative Skills→
qdhenryqdhenry

ui-ux-pro-max

Generate comprehensive UI design systems from project requirements.

Community
Advanced
chicongstchicongst
2

ui-design

Automates UI design execution by applying tokens, palettes, typography and spacing across frameworks.

Community
Intermediate
beattherbeatther
1

ui-ux-pro-max

Design cohesive UI systems with color, typography, and component patterns across 9 stacks.

Community
Advanced
HCMUTE-RTICHCMUTE-RTIC

ui-ux-pro-max

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

Official
Advanced