This is essentially a command line design reference system disguised as a Claude skill. You run a Python script that searches through CSV databases of 50+ UI styles, 97 color palettes, 57 font pairings, and 99 UX guidelines to get specific recommendations for your project. The workflow is pretty rigid: always start with the design system command to get reasoning-based suggestions for your product type, then drill down into specific domains like charts or accessibility rules. It defaults to HTML/Tailwind but covers nine stacks including React Native and SwiftUI. The interesting bit is the priority system that flags accessibility and touch targets as critical before you even think about animations. Feels more like a design linter than creative inspiration, which might be exactly what you need when building dashboards at 2am.

skills.sh installs
1.9K
GitHub stars
33.2K
last updated
Aug 21, 2026

Install

$ npx -y skills add davila7/claude-code-templates --skill ui-ux-pro-max --agent claude-code

Installs into .claude/skills of the current project.

Files

UI/UX Pro Max - Design Intelligence

Comprehensive design guide for web and mobile applications. Contains 50+ styles, 97 color palettes, 57 font pairings, 99 UX guidelines, and 25 chart types across 9 technology stacks. Searchable database with priority-based recommendations.

When to Apply

Reference these guidelines when:

  • Designing new UI components or pages
  • Choosing color palettes and typography
  • Reviewing code for UX issues
  • Building landing pages or dashboards
  • Implementing accessibility requirements

Rule Categories by Priority

PriorityCategoryImpactDomain
1AccessibilityCRITICALux
2Touch & InteractionCRITICALux
3PerformanceHIGHux
4Layout & ResponsiveHIGHux
5Typography & ColorMEDIUMtypography, color
6AnimationMEDIUMux
7Style SelectionMEDIUMstyle, product
8Charts & DataLOWchart

Quick Reference

1. Accessibility (CRITICAL)

  • color-contrast - Minimum 4.5:1 ratio for normal text
  • focus-states - Visible focus rings on interactive elements

Sponsors

Details

Repository
github.com/davila7/claude-code-templates
Categories
Frontend Development, DevOps & CI/CD, Git & Pull Requests, Documentation, Code Review & Quality, AI & Agent Building, Debugging, Productivity & Planning, Mobile Development, Design & UI/UX, Finance & Trading
First seen
May 16, 2026

More from davila7/claude-code-templates

All 618
1chakra-ui avatarchakra-ui-migratechakra-ui/chakra-uiMigrate Chakra UI projects from v2 to v3, covering package changes, codemods, provider setup, color mode, prop renaming, compound components, theming, recipes, 1.9Kskills.sh installs
2capawesome-team avatarionic-angularcapawesome-team/skillsGuides the agent through Angular-specific patterns for Ionic app development. Covers project structure, standalone vs NgModule architecture detection, Angular R1.8Kskills.sh installs
3starchild-ai-agent avatarui-designstarchild-ai-agent/official-skillsUI/UX quality gate and build guide for every visual output — landing pages, dashboards, web apps, portfolios, and tools. ui-design remains the main entry point.1.8Kskills.sh installs
4alirezarezvani avatarsenior-frontendalirezarezvani/claude-skillsFrontend development skill for React, Next.js, TypeScript, and Tailwind CSS applications. Use when building React components, optimizing Next.js performance, an1.7Kskills.sh installs
5davila7 avatarui-design-systemdavila7/claude-code-templatesUI design system toolkit for Senior UI Designer including design token generation, component documentation, responsive design calculations, and developer handof1.7Kskills.sh installs
6vtex avatarvtex-io-react-appsvtex/skillsApply when building React components under react/ or configuring store blocks in store/ for VTEX IO apps. Covers interfaces.json, contentSchemas.json for Site E1.7Kskills.sh installs