ui-ux-pro-max

Search UI/UX design guidelines for styles, palettes, and typography.

1|Updated Jan 1, 2026
One-click install
npx skills add https://github.com/raydocs/SkinLab --skill ui-ux-pro-max-raydocs
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/raydocs/SkinLab/tree/main/.claude/skills/ui-ux-pro-max
Command: npx skills add https://github.com/raydocs/SkinLab --skill ui-ux-pro-max-raydocs

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

Design teams often struggle to quickly locate consistent UI patterns, color palettes, typography, and dashboard guidelines across multiple projects. This skill provides a centralized, searchable knowledge base of 50+ styles, 21 palettes, 50 font pairings, 20 charts, and stack-specific recommendations to speed up decision-making and maintain visual coherence.

Core Features & Use Cases

  • Searchable UI style, palette, typography, and chart library to accelerate design sprints.
  • Stack-aware guidelines for React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, and Tailwind.
  • Product and dashboard recommendations to inform design systems and component choices.
  • Use Case: Quickly assemble a landing page or dashboard spec by querying style, color, and typography guidance.

Quick Start

Use the UI/UX Pro Max skill to fetch design guidelines for a given product and stack, e.g., "design a SaaS dashboard using glassmorphism with a navy color palette."

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 find consistent UI style and color palette guidelines for a SaaS dashboard?

To find consistent UI style guidelines for a SaaS dashboard, query a centralized design knowledge base containing 50+ styles and 21 color palettes to retrieve style, color, typography, and component recommendations that maintain visual coherence across marketing pages and apps.

What is the best way to get typography and font pairing recommendations for web design?

The best way to get typography recommendations for web design is to search a dedicated UI/UX library of 50 font pairings. This returns relevant guidelines and UX best practices to speed up decision-making and inform your design system.

Can I use this UI/UX design knowledge base with frameworks like React, Next.js, or Flutter?

Yes, you can use this UI/UX design knowledge base with frameworks like React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, and Tailwind. It provides stack-aware guidelines and component recommendations specific to your chosen development stack.

How do I assemble a landing page design spec using glassmorphism and a navy color palette?

To assemble a landing page design spec using glassmorphism and a navy palette, query the design knowledge base with your product requirements. It uses BM25-based search across CSV data assets to return relevant guidelines, palettes, and UX best practices.

Does this design library include guidelines for building and styling charts?

Yes, the design library includes 20 chart guidelines and recommendations. You can search the knowledge base to fetch chart and dashboard component guidance, ensuring your data visualizations align with your overall UI style and typography choices.