skills.rest
darblex
darblexCOMMUNITY
Explore all skills by this author →
GitHub

ui-ux-pro-max

Generate design systems and frontend UI code for web frameworks.

Updated Mar 10, 2026
Search Tags:#design system#ux design#frontend development#ui design#interface guidelines#component specs
One-click install
npx skills add https://github.com/darblex/price-compare-israel --skill ui-ux-pro-max-darblex
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/darblex/price-compare-israel/tree/main/workspace/skills/ui-ux-pro-max
Command: npx skills add https://github.com/darblex/price-compare-israel --skill ui-ux-pro-max-darblex

SYSTEM DOCUMENTATION & REQUIREMENTS

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

What problem does it solve?

This Skill provides comprehensive UI/UX design intelligence and implementation guidance, helping users create polished, user-friendly interfaces across various platforms and technologies.

Core Features & Use Cases

  • UI/UX Design Guidance: Offers direction on information architecture, visual style, design systems, and component specifications.
  • Frontend Implementation: Generates and critiques frontend UI code (HTML/CSS/JS, React, Next.js, Vue, Svelte, Tailwind).
  • Design System Generation: Creates design tokens and component guidelines.
  • Use Case: A user needs to design a new dashboard for a SaaS product. They can use this Skill to get recommendations on layout, color palette, typography, and even generate initial component code snippets.

Quick Start

Use the ui-ux-pro-max skill to generate a design system for a SaaS dashboard.

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 SaaS dashboard?▼

To generate a design system for a SaaS dashboard, you need structured guidance on information architecture, visual style, and component specifications. This Skill provides UI/UX design intelligence to define design tokens, layout rules, and copy guidelines for polished interfaces.

What is the best way to create UI component specs for web applications?▼

Creating UI component specs for web applications requires defining visual properties, behaviors, and accessibility rules. This Skill generates detailed component guidelines and design tokens, ensuring your interface specifications are consistent and ready for frontend implementation.

Can I use this to get frontend UI code for React and Tailwind?▼

Yes, you can use this to get frontend UI code for React and Tailwind. It generates and critiques frontend implementation code across multiple frameworks including React, Next.js, Vue, Svelte, and HTML/CSS/JS, aligning the output with your established design system.

Does UI design guidance include accessibility and microcopy recommendations?▼

Yes, UI design guidance includes accessibility and microcopy recommendations. It covers comprehensive UX flows, information architecture, visual style direction, and interface copy guidelines to ensure your polished interfaces are both usable and compliant.

How do I critique and improve my existing web interface design?▼

To critique and improve your existing web interface design, you can submit your current UI code for review. This Skill evaluates frontend implementations against design intelligence principles, offering actionable feedback on visual style, accessibility, and component structure.

Related Skills

Explore More Design & Creative Skills→
ZiadNagarZiadNagar

animation-systems

Define motion tokens, choreography patterns, and reduced-motion support for design systems.

Community
Advanced
vcnttttvcntttt
1

frontend-design

Generate frontend interfaces from design requirements across frameworks.

Community
Advanced
wjyugutouwjyugutou

web-design-guidelines

Automate UI code review against Web Interface Guidelines for accessibility and consistency.

Community
Intermediate
fgarofalo56fgarofalo56
6

tailwind-ui

Guide Tailwind CSS styling for responsive UI components with utility classes.

Community
Intermediate