moai-domain-uiux

Solid

UI/UX design systems specialist covering accessibility, icons, theming, design tokens, and user experience patterns. Use when working on design systems, WCAG compliance, ARIA patterns, or dark mode theming.

Web & Frontend 1,050 stars 192 forks Updated today Apache-2.0

Install

Quality Score: 99/100

Stars 20%

100

Recency 20%

100

Frontmatter 20%

70

Documentation 15%

100

Issue Health 10%

50

License 10%

100

Description 5%

100

Skill Content

## Quick Reference Core UI/UX Foundation - Enterprise-grade UI/UX foundation integrating design systems (W3C DTCG 2025.10), component architecture (React 19, Vue 3.5), accessibility (WCAG 2.2), icon libraries (200K+ icons), and theming systems. Unified Capabilities: - Design Systems: W3C DTCG 2025.10 tokens, Style Dictionary 4.0, Pencil MCP workflows - Component Architecture: Atomic Design, React 19, Vue 3.5, shadcn/ui, Radix UI primitives - Accessibility: WCAG 2.2 AA/AAA compliance, keyboard navigation, screen reader optimization - Icon Libraries: 10+ ecosystems (Lucide, React Icons 35K+, Tabler 5900+, Iconify 200K+, Hugeicons 27K+) - Theming: CSS variables, light/dark modes, theme provider, brand customization When to Use: - Building modern UI component libraries with design system foundations - Implementing accessible, enterprise-grade user interfaces - Setting up design token architecture for multi-platform projects - Integrating comprehensive icon systems with optimal bundle sizes - Creating customizable theming systems with dark mode support Module Organization: - Components: modules/component-architecture.md (Atomic Design, component patterns, props APIs) - Design Systems: modules/design-system-tokens.md (DTCG tokens, Style Dictionary, Pencil MCP) - Accessibility: modules/accessibility-wcag.md (WCAG 2.2 compliance, testing, navigation) - Icons: modules/icon-libraries.md (10+ libraries, selection guide, performance optimization) - Theming: modules/theming-system....

Details

Author: modu-ai
Repository: modu-ai/moai-adk
Created: 8 months ago
Last Updated: today
Language: Go
License: Apache-2.0

Integrates with

Anthropic · AI

Similar Skills

Semantically similar based on skill content — not just same category

Web & Frontend Listed

ui-ux-architect

UI/UX standards — WCAG 2.2 AA, Radix + Tailwind 4 + shadcn/ui, design-token theming, mandatory loading/error/empty/success states on every async surface, mobile-first responsive, keyboard parity, contrast checked in CI. Use when designing UI components, building a design system, or auditing accessibility.

2 Updated 1 weeks ago

Web & Frontend Listed

design-ux

UI/UX design patterns and design system architecture. TRIGGER when: working on component design, layout/grid decisions, design tokens, color palettes, typography, accessibility (WCAG), responsive design, TUI aesthetics, or creating DESIGN.md documentation. Covers React, Tailwind CSS, terminal UI, and mobile patterns with a monospace-first, constraint-based design philosophy. DO NOT TRIGGER when: writing React/TypeScript code logic (use droo-stack skill), building Raxol TUI framework features (use raxol skill), working with CSS-in-JS runtime concerns (this skill covers design decisions, not runtime), or designing API/module/public-surface interfaces (use interface-designer skill).

1 Updated 1 weeks ago

Web & Frontend Listed

ui-design

Use for frontend UI, layouts, components, responsive behavior, visual design, and usability.

0 Updated yesterday

Web & Frontend Listed

ui-ux-pro-max

UI/UX design intelligence. 50 styles, 21 palettes, 50 font pairings, 20 charts, 9 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui). Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, check UI/UX code. Projects: website, landing page, dashboard, admin panel, e-commerce, SaaS, portfolio, blog, mobile app, .html, .tsx, .vue, .svelte. Elements: button, modal, navbar, sidebar, card, table, form, chart. Styles: glassmorphism, claymorphism, minimalism, brutalism, neumorphism, bento grid, dark mode, responsive, skeuomorphism, flat design. Topics: color palette, accessibility, animation, layout, typography, font pairing, spacing, hover, shadow, gradient. Integrations: shadcn/ui MCP for component search and examples.

335 Updated today

Web & Frontend Listed

ui-ux-pro-max

UI/UX design intelligence. 50 styles, 21 palettes, 50 font pairings, 20 charts, 9 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui). Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, check UI/UX code. Projects: website, landing page, dashboard, admin panel, e-commerce, SaaS, portfolio, blog, mobile app, .html, .tsx, .vue, .svelte. Elements: button, modal, navbar, sidebar, card, table, form, chart. Styles: glassmorphism, claymorphism, minimalism, brutalism, neumorphism, bento grid, dark mode, responsive, skeuomorphism, flat design. Topics: color palette, accessibility, animation, layout, typography, font pairing, spacing, hover, shadow, gradient. Integrations: shadcn/ui MCP for component search and examples.

4 Updated yesterday