UX design principles, color theory, typography systems, component library design, and usability heuristics. Comprehensive design guidance for creating exceptional user experiences with Adobe Color-inspired palette creation, type system design, and accessibility-first thinking.
Plugin ux-design from marketplace standardbeagle-tools in standardbeagle/standardbeagle-tools. Commands read from the repo's manifest — 4 days ago.
ux-design-accessibilityInclusive design + WCAG guidelines for accessible experiences. Covers visual, motor, cognitive, auditory accessibility from design perspective. 無障礙設計與WCAG指南。 Use when: reviewing designs for accessibility, implementing WCAG compliance, designing focus states, handling color independence, ensuring tou
ux-design-color-palette\"Interactive color palette creation wizard with inspiration from Adobe Color, Coolors, and color theory principles. 互動調色板創建引導：Adobe Color、Coolors及色彩理論原則驅動，含無障礙驗證。 Use when: creating brand color palette, generating tonal scales, validating color contrast, extending palette for dark mode.\"
ux-design-color-theoryColor theory for harmonious, purposeful palettes. Covers color-wheel relationships, psychological impact, accessibility, systematic palette generation. 色彩學全覽。 Use when: creating color palette, selecting brand colors, ensuring color accessibility, generating tonal scales or dark mode variants.
ux-design-component-designDesign principles for creating cohesive component libraries and design systems. Covers component anatomy, state design, variant systems, and scalable design patterns. 設計系統元件庫之法：解剖、狀態、變體、規模化。 Use when: designing component library, defining component states or variants, planning design system, establi
ux-design-component-library\"Design cohesive component library structure with variant systems, state definitions, and documentation guidelines. 設計帶有變體系統、狀態定義和文檔指南的凝聚元件庫結構。 Use when: planning component library, defining component variants and states, establishing design token system, creating component documentation.\"
ux-design-design-tokens\"Create comprehensive design token system for design-to-development handoff. 建立完整設計token系統以橋接設計與開發交接。 Use when: defining design tokens, setting up token architecture, creating theme support, generating CSS custom properties or multi-platform token outputs.\"
ux-design-iconographyIcon design principles, selection criteria, and system creation. Build cohesive icon sets that enhance usability and reinforce brand identity. 圖示設計原則、選擇準則與系統建立：構建增強可用性、強化品牌識別的一致圖示集。 Use when: selecting or designing icons, building icon system, defining icon sizing or accessibility requirements, choo
ux-design-recommenderRoutes any UX / visual-design intent to the one right manual ux-design skill — the single auto-invoked gateway; all other ux-design skills are manual. ux-design 唯一自動網關，導向正確之手動技藝。 Use when: design color palette, typography, components or design system, design tokens, icons, responsive layout, visual
ux-design-responsive-patternsResponsive design strategies, breakpoint systems, and adaptive layout patterns. Create designs that work beautifully across all devices and contexts. 響應式設計策略、斷點系統與自適應佈局模式：跨設備情境的美觀設計。 Use when: designing layouts for multiple screen sizes, defining breakpoint systems, adapting navigation for mobile, h
ux-design-typography-system\"Design complete typography system with font selection, scale creation, and responsive behavior. 設計完整字體系統：字體選擇、比例建立與響應式行為。 Use when: creating typography system from scratch, selecting font pairings, generating type scale, defining responsive type behavior.\"
ux-design-typographyTypography system design — type selection, scale creation, pairing strategies, readability optimization. Cohesive type systems enhancing brand + UX. 字體系統設計。 Use when: selecting fonts, creating type scale, designing responsive typography, optimizing text readability, establishing font loading strateg
ux-design-ux-audit\"Conduct comprehensive UX evaluation using Nielsen's heuristics and usability best practices. 運用Nielsen啟發式原則進行全面UX評估，識別並優先處理可用性問題。 Use when: evaluating interface for usability, conducting formal heuristic review, generating prioritized issue report.\"
ux-design-ux-heuristicsUX evaluation via Nielsen heuristics, cognitive principles, modern usability patterns. Framework for identifying + resolving usability issues. Nielsen啟發式評估框架。 Use when: conducting UX audit, evaluating interface usability, identifying usability violations, applying cognitive design principles.
ux-design-visual-hierarchyLayout composition, visual weight distribution, and attention flow. Create designs that guide users effortlessly through content with intentional hierarchy. 佈局構圖、視覺重量分配與注意力流：以意圖層次引導用戶無障礙瀏覽。 Use when: establishing visual priority, composing page layouts, directing user attention, evaluating whether h
design-consultantSpecialized agent for comprehensive UX design consultation, combining multiple design disciplines to provide holistic design guidance. 綜合UX設計諮詢代理：融合多設計學科，提供整體性設計指導。 Use when: requesting full project design consultation, needing integrated multi-discipline design review, getting design system guidanc
Browser superpowers for AI coding agents: dev-server and reverse proxy with traffic logging, a deduped priority error inbox, 50+ frontend diagnostic functions, accessibility/performance/security/SEO/responsive/API/loading audits, visual-regression snapshots, replay testing, tunnels, and sketch/design modes
36 skills · 4 agents · hooks
Dart task management with adversarial cooperation loops and full dart-query MCP schema parity - DartQL batch operations, advanced filtering, task relationships, documents, time tracking, and automated task execution through quality verification pipelines. Requires @standardbeagle/[email protected]+ (dartai_loop_snapshot tool used by /dartai:start).
29 skills · 6 agents · hooks
Token-efficient Figma integration with query-based data shaping, image export, design tokens, and adversarial design library extraction. Build production-ready component libraries with exact CSS, assets, HTML mockups, and comprehensive documentation using the Ralph Wiggum quality loop.
28 skills · 4 agents
Contextually-loaded development standards and project-aware skills. Replaces bulk CLAUDE.md instructions with on-demand rules, language-scoped guidelines, and project-type skill templates.
25 skills · hooks
SLOP (Simple Language Open Protocol) integration for MCP management. Migrate existing MCP setups, search and execute tools, manage resources, and orchestrate multiple MCP servers. Includes Dart MCP tool reference skills for reduced get_metadata calls.
23 skills · 2 agents · 1 MCP server
UX-driven development toolkit for building accessible, user-centered websites and applications. Integrates UX principles, accessibility verification (WCAG 2.2), Nielsen's heuristics, and usability best practices directly into the development workflow. Includes agents for comprehensive audits and component design.
20 skills · 4 agents
Collection of example skills demonstrating various capabilities including skill creation, MCP building, visual design, algorithmic art, internal communications, web testing, artifact building, Slack GIFs, and theme styling
19 skills
Comprehensive PR review agents specializing in comments, tests, error handling, type design, code quality, and code simplification
1 command · 6 agents
Professional UI/UX design intelligence for AI coding assistants. Includes searchable databases of styles, colors, typography, charts, and UX guidelines for React, Next.js, Astro, Vue, Nuxt.js, Nuxt UI, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui, Jetpack Compose, Angular, Laravel, JavaFX, and Three.js.
7 skills
tasteskill 2.5.1: professional company websites at the figma.com and x.ai level, with one section per screen, real photographs, real product UI, effects kept for tech and gaming pages, and a real-browser checker and finish gate.
1 skill
Design fluency for frontend development. 1 skill with 24 commands (/impeccable polish, /impeccable audit, /impeccable critique, etc.) and curated anti-pattern detection.
1 skill · 4 agents · hooks
Build, preview, and test UI components with Storybook.
7 skills
This page updates itself from your repo. Add the badge to your README, or get it Featured to pin it above the organic results with a followed link to your site.