skills.rest
angelgarciasolorzano
angelgarciasolorzanoCOMMUNITY
Explore all skills by this author →
GitHub

ui-ux-design-pro

Generate UI/UX design systems with tokens, palettes, and typography scales.

Updated Sep 25, 2025
Search Tags:#design system#user experience#ux design#ui design#user interface
One-click install
npx skills add https://github.com/angelgarciasolorzano/social-hub --skill ui-ux-design-pro
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-ux-design-pro
Source: https://github.com/angelgarciasolorzano/social-hub/tree/main/.agents/skills/ui-ux-design-pro
Command: npx skills add https://github.com/angelgarciasolorzano/social-hub --skill ui-ux-design-pro

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires pypdf2, beautifulsoup4, requests, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill provides expert-level UI/UX design support, streamlining the process of creating professional, data-driven interfaces for applications, design systems, and audits.

Core Features & Use Cases

  • Application Design: Generate complex UIs for dashboards, SaaS, AI tools from scratch.
  • Design Systems: Create comprehensive design systems with tokens, palettes, and typography.
  • UI Audit: Conduct quality and accessibility audits on existing UIs.
  • Pattern Search: Access a repository of proven real-world design patterns and implementation details.
  • Use Case: Need a fintech dashboard with advanced UI/UX features? Use this Skill to design and implement a fully functional dashboard with the right aesthetic and functionality.

Quick Start

Use the ui-ux-design-pro skill to generate a design system for a fintech dashboard with the theme "Fintech Pro".

Frequently Asked Questions about ui-ux-design-pro

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate a complete design system with UI tokens and typography scales?▼

To generate a design system, provide the desired design direction, color temperature, and tech stack. The system processes these inputs to output a structured Markdown file containing architectural palettes, tokens, typography scales, and UX guidelines.

What's the best way to design a complex SaaS or fintech dashboard interface from scratch?▼

Designing a complex SaaS or fintech dashboard requires defining your theme and stack inputs. The system then generates expert-level UI/UX guidelines and architectural palettes to streamline the creation of professional, data-driven interfaces.

Can I conduct a UX audit on an existing user interface using this approach?▼

Yes, you can conduct a UI audit on existing user interfaces. The system evaluates quality and accessibility, leveraging a repository of real-world design patterns accessed via a BM25 search engine to identify areas for improvement.

Do I need to specify a color temperature and tech stack to get UX guidelines?▼

Yes, specifying design direction, color temperature, and stack is required. These inputs drive the generation of accurate architectural palettes, typography scales, and tailored UX guidelines for your application.

What format does the generated UI design system output use?▼

The UI design system outputs as a structured Markdown file. This document comprehensively details your generated design tokens, architectural palettes, typography scales, and specific UX guidelines.

Related Skills

Explore More Design & Creative Skills→
AmbitionsXXXVAmbitionsXXXV
2

ui-ux-pro-max

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

Community
Advanced
v1nizxv1nizx

stitch::extract-design-md

Extract color palettes, typography scales, and component styling patterns from frontend source code.

Community
Advanced
WizCoderrWizCoderr

ui-ux-pro-max

Generate a design system from a searchable database of design patterns and guidelines.

Community
Advanced
cgRGMcgRGM
1

web-design-guidelines

Reviews UI code against the latest Web Interface Guidelines, returning terse file:line findings.

Community
Intermediate