skills.rest
yatin-rai
yatin-raiCOMMUNITY
Explore all skills by this author →
GitHub

ui-ux-pro

Provide UI/UX design patterns and best practices for 16 web frameworks.

1|Updated Jun 27, 2026
Search Tags:#web development#front-end#design system#ui/ux#code patterns
One-click install
npx skills add https://github.com/yatin-rai/ui-ux-consultant-skill --skill ui-ux-pro-yatin-rai
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-ux-pro
Source: https://github.com/yatin-rai/ui-ux-consultant-skill/tree/main
Command: npx skills add https://github.com/yatin-rai/ui-ux-consultant-skill --skill ui-ux-pro-yatin-rai

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 guidance and code patterns for 16 popular web frameworks, enabling designers and developers to build high-quality user interfaces more efficiently.

Core Features & Use Cases

  • Framework Coverage: Comprehensive coverage of Angular, React, Vue, Next.js, Nuxt.js, Svelte, Astro, SwiftUI, Jetpack Compose, Flutter, React Native, HTML+Tailwind, shadcn/ui, Laravel, Three.js, Nuxt UI.
  • Design Patterns: Offers code patterns and best practices for each framework.
  • Use Case: If you're building a SaaS dashboard and need guidance on UI/UX best practices for Angular, use this skill to explore design patterns and code snippets tailored for Angular.

Quick Start

Use the ui-ux-pro skill to learn about best practices for designing a dashboard in Angular.

Frequently Asked Questions about ui-ux-pro

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

FAQPage Schema
How do I apply UI/UX design best practices when building a dashboard in Angular?▼

To apply UI/UX design best practices for an Angular dashboard, you can use this skill to access framework-specific code patterns, design system recommendations, and interface efficiency guidelines. It provides tailored snippets for building high-quality SaaS interfaces.

What are the best UI code patterns for React and Vue front-end development?▼

The best UI code patterns for React and Vue front-end development include reusable components and structured design systems. This skill provides design intelligence covering both frameworks to help streamline your interface quality and development efficiency.

Does this UI/UX design guidance support mobile frameworks like Flutter and React Native?▼

Yes, this UI/UX design guidance fully supports mobile frameworks like Flutter and React Native. It also covers SwiftUI and Jetpack Compose, offering code patterns and best practices to improve mobile user interface quality across these environments.

Can I get design system recommendations for HTML and Tailwind CSS projects?▼

You can get design system recommendations for HTML and Tailwind CSS projects directly through this skill. It delivers specific code patterns and UI/UX best practices tailored for HTML+Tailwind, alongside other frameworks like shadcn/ui and Nuxt UI.

When should I use framework-specific UI patterns instead of general web development design rules?▼

You should use framework-specific UI patterns when you need to align with the particular architecture of tools like Svelte, Astro, or Next.js. This skill provides targeted design intelligence for 16 frameworks, ensuring your UI components match framework conventions rather than relying on generic rules.

Related Skills

Explore More Design & Creative Skills→
wildbitcawildbitca
1

common-ui-design

Define UI aesthetic and design system tokens before frontend implementation.

Official
Advanced
fefogarciafefogarcia
1

web-design-guidelines

Review UI code for compliance with Web Interface Guidelines.

Community
Intermediate
endorphin-aiendorphin-ai
3

frontend-mean

Develop React frontends for MEAN stack applications with Vite and Tailwind CSS.

Official
Intermediate
melandlabsmelandlabs
909

ui-ux-pro-max

Generate design systems for web and mobile applications.

Official
Advanced