Can it help with mobile-first development?

Yes, it utilizes fluid layouts, relative units, and content-based media queries to ensure interfaces are optimized for both touch and desktop users.

Which tech stack does this design skill work best with?

It is optimized for modern web development using Tailwind CSS, shadcn/ui components, Phosphor icons, and Framer Motion.

Does it follow web accessibility standards?

Yes, it prioritizes WCAG 2.1 AA compliance, focusing on color contrast, keyboard navigability, and semantic HTML.

Does this skill automatically change my code's styling?

No. The UX Designer skill follows a strict 'Always Ask' protocol, requiring explicit user approval before making any design decisions or style changes.

How does it help avoid generic 'AI-looking' designs?

It explicitly avoids default training data patterns like excessive Bauhaus or Apple-clone styles, instead suggesting unique color pairs, patterns, and historical design inspirations.

UX Designer

Name: UX Designer
Author: Cornjebus

byCornjebus

0•

Design Tools

Guides the creation of unique, accessible, and user-centered interfaces with a focus on non-generic design patterns.

The UX Designer skill transforms Claude into a specialized design consultant capable of crafting distinctive and functional user interfaces. It emphasizes breaking away from generic, AI-generated aesthetics by focusing on material honesty, purposeful typography, and sophisticated color palettes. Built with a strict 'ask-first' protocol for design decisions, it provides deep expertise in responsive layouts, interaction physics, and accessibility standards while leveraging modern tools like shadcn/ui and Tailwind CSS to ensure production-grade implementation.

Key Features

01Strict design decision protocol that prioritizes user collaboration and approval before implementation.

02Optimized implementation patterns for shadcn/ui components, Tailwind CSS, and Phosphor icons.

03Subtle motion design principles using Framer Motion and CSS for purposeful user feedback.

040 GitHub stars

05Comprehensive typography and color systems based on mathematical ratios and WCAG accessibility standards.

06Anti-generic aesthetic guidance to create distinctive interfaces that stand out from standard SaaS patterns.

Use Cases

01Designing a unique brand identity and component library for a new web application.

02Establishing a coherent design language including typography, color palettes, and spatial grids.

03Refactoring generic UI components into high-quality, accessible, and mobile-responsive interfaces.

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add cornjebus/amair ux-designer

For use in Claude.ai and ChatGPT

Download Skill