skills.rest
hiroto0701
hiroto0701COMMUNITY
Explore all skills by this author →
WebsiteGitHub

ui-ux-pro-max

Generate design systems with color palettes, typography, and UX best practices.

Updated Dec 4, 2025
Search Tags:#typography#accessibility#design system#ui/ux#color palette#component library#frontend development
One-click install
npx skills add https://github.com/hiroto0701/dotfiles --skill ui-ux-pro-max-hiroto0701
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/hiroto0701/dotfiles/tree/main/private_dot_claude/skills/ui-ux-pro-max
Command: npx skills add https://github.com/hiroto0701/dotfiles --skill ui-ux-pro-max-hiroto0701

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill streamlines UI/UX design and implementation by providing a comprehensive, searchable database of design patterns, styles, color palettes, typography, and best practices across various technology stacks.

Core Features & Use Cases

  • Design System Generation: Create detailed design systems tailored to specific project types (e.g., SaaS, e-commerce).
  • Style & Component Guidance: Get recommendations for UI styles, color schemes, font pairings, and component implementation.
  • Best Practice Enforcement: Access critical UX guidelines for accessibility, performance, and interaction design.
  • Use Case: When building a new landing page for a fintech startup, use this Skill to generate a professional design system, including color palettes, typography, and layout recommendations, ensuring a consistent and user-friendly experience.

Quick Start

Use the ui-ux-pro-max skill to generate a design system for a 'fintech crypto dashboard' 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 design system for a specific project type like a SaaS or e-commerce application?▼

To generate a design system, provide your project type and keywords. The skill outputs tailored color palettes, typography pairings, and component implementation guidance for web and mobile applications.

What's the best way to choose a color palette and typography for a frontend development project?▼

Choosing a color palette and typography is handled by querying the skill with your project requirements. It returns automated style recommendations based on your project type and design system best practices.

Can I get UX best practices and accessibility guidelines for a component library?▼

Yes, you can get UX best practices and accessibility guidelines. The skill provides critical interaction design rules and performance standards to enforce consistency across your component library.

Does this design intelligence tool support multiple technology stacks for UI implementation?▼

The design intelligence tool supports multiple technology stacks for UI implementation. It facilitates the creation of design systems and component guidance across various frontend development environments.

How do I create a consistent layout for a fintech crypto dashboard?▼

Create a consistent layout by requesting a design system for your fintech crypto dashboard. The skill generates professional color palettes, typography, and layout recommendations ensuring a user-friendly experience.

Why do I need a component library and design system for web and mobile applications?▼

You need a component library and design system to streamline UI/UX design and implementation. They provide a searchable database of design patterns and best practices ensuring consistency across web and mobile applications.

Related Skills

Explore More Design & Creative Skills→
takemo101takemo101

basic-design-writer

Generate foundational system design documents in Japanese with Mermaid diagrams.

Community
Intermediate
atrislabsatrislabs

design

Enforce frontend aesthetic policies for UI, component, and landing page development.

Official
Intermediate
VidyaBodepudiVidyaBodepudi
2

frontend-ui-engineering

Review web components for accessibility, responsiveness, and performance.

Community
Advanced
dmccrearydmccreary
90

microsim-matcher

Match diagram specifications to MicroSim generators and rank candidates with scores.

Community
Basic