How does this skill help with web accessibility?

It applies WCAG 2.1 guidelines to your project, recommending semantic HTML, appropriate ARIA roles, and high-contrast color palettes to ensure inclusivity for all users.

What UI frameworks is this skill compatible with?

While the principles are framework-agnostic, it is highly compatible with modern frontend environments like React, Vue, and Tailwind CSS through its focus on component-driven design.

Can this skill help me build a design system from scratch?

Yes, it provides a structured framework for defining design tokens, building component hierarchies, and establishing a consistent 8pt grid spacing system.

Does it support mobile-first responsive design?

Absolutely. It includes specific strategies for breakpoints, touch-target optimization (44px+), and adaptive navigation patterns like tab bars and side menus.

UI/UX Design Expert

Name: UI/UX Design Expert
Author: miles990

bymiles990

•

Design Tools

Optimizes user interfaces and experiences using professional design principles, accessibility standards, and systematic patterns.

This skill empowers Claude with deep expertise in UI/UX design, bridging the gap between functional code and exceptional user experience. It provides domain-specific guidance on interface design principles, accessibility compliance (WCAG 2.1), usability evaluation based on Nielsen's heuristics, and the implementation of scalable design systems. Whether you are building mobile-first responsive layouts, establishing design tokens, or auditing an existing application for usability, this skill ensures your project follows industry best practices for engagement and inclusivity.

Key Features

01Implementation of systematic 8pt grid layouts and spacing tokens

02Strategic responsive design planning for mobile, tablet, and desktop

03Comprehensive WCAG 2.1 accessibility auditing and remediation

041 GitHub stars

05Design system architecture including semantic coloring and component libraries

06Usability evaluation using Nielsen's 10 Heuristic principles

Use Cases

01Creating intuitive interaction patterns and navigation flows for new features

02Developing a robust and scalable design system for complex web applications

03Auditing and fixing accessibility gaps to meet AA or AAA compliance standards

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add miles990/claude-domain-skills ui-ux-design

For use in Claude.ai and ChatGPT

Download Skill