🎯Skills33
A set of UX and design system skills for AI agents covering brand identity, design tokens, layout, components, accessibility, and performance. Includes a full 6-stage UX orchestrator that goes from brand analysis to tokens, layout, components, polish, and accessibility gating.
Applies Nielsen's 10 Usability Heuristics for evaluating and improving UI design, covering interaction flows, error messages, system visibility, and user control patterns.
A set of UX and design system skills for AI agents covering brand identity, color palettes, typography scales, layout patterns, component design, accessibility, and a full 6-stage UX orchestration pipeline from brand to polished UI.
A set of practical UX and design system skills for AI agents covering visual hierarchy, typography, accessibility, color systems, responsive layouts, form design, and interaction patterns distilled from enterprise and consumer product experience.
A set of UX and design system skills for AI agents covering hierarchy, typography, accessibility, interaction patterns, layout, components, and a full 6-stage UX orchestration pipeline. Distilled from enterprise tools, SaaS, financial platforms, and consumer apps.
Teaches semantic HTML5 structure, SEO fundamentals, alt text best practices, progressive enhancement, and SPA considerations for building accessible, search-optimized web UIs.
A collection of UX and design system skills for AI agents covering typography, color, layout, accessibility, interaction patterns, and usability heuristics, distilled from enterprise and consumer product design experience.
A collection of UX and design system skills for AI agents, covering visual hierarchy, typography, accessibility, interaction patterns, responsive layouts, form design, and a full 6-stage UX orchestration pipeline from brand identity to accessibility gating.
Applies Disney's 12 animation principles, cinematic storytelling techniques, and comic book conventions to web UI for designing transitions, micro-interactions, onboarding flows, and scroll animations.
Defines the six interactive states (rest, hover, active, focus, disabled, loading) for buttons and interactive elements, with algorithmic color derivation from base colors using HSL adjustments.
Guides structuring large applications with proper naming, navigation design, data model alignment in UI, and confirm dialogs for destructive actions, building user mental models for complex multi-module products.
A set of practical UX and design system skills for AI agents covering visual hierarchy, typography, accessibility, color systems, responsive layouts, form design, and interaction patterns distilled from enterprise and consumer product experience.
A UI design skill for establishing clear visual hierarchy through size, color, weight, contrast, and position, ensuring primary actions stand out and users are guided to what matters most on each screen.
Pipeline skill that extracts live design tokens from a URL or DESIGN.md, normalizes them into a semantic system, applies UX principles, and outputs an actionable UI spec for building UI matching an existing brand.
A UX design skill that guides AI agents on responsive layout patterns for mobile, tablet, and desktop, covering navigation, content sections, and sticky behavior across breakpoints.
A UI design skill for creating purposeful micro-interactions -- small animations that confirm actions, reward milestones, and add physical texture to interfaces, drawing from natural-world behaviors like spring, inertia, and momentum.
Guides the use of CSS sticky and fixed positioning for persistent UI elements like navigation headers, bottom toolbars, and floating action buttons. Covers the differences between position:fixed and position:sticky, mobile-specific patterns, z-index management, and scroll-aware design.
Derives a full UI color palette algorithmically from one or two brand colors — generating darker/lighter variants for interactive states, desaturated greys for borders and backgrounds, and semantic colors for status indicators.
Teaches AI agents to apply Gestalt principles (proximity, similarity, common region, connectedness) when designing or reviewing UI layouts, ensuring visual structure communicates element relationships without relying on labels.
A UX design skill that ensures visual consistency across component families like buttons, inputs, and pills by enforcing shared border-radius, color schemes, and height values. Part of a comprehensive design system skill set covering hierarchy, typography, accessibility, and interaction patterns.
A UX design skill that teaches AI agents when and how to use real-world UI metaphors like cards, carousels, and drawers, as part of a comprehensive design system covering hierarchy, typography, accessibility, and interaction patterns.
A UX design skill that teaches AI agents about shadow scales, border-radius conventions, and card/modal depth patterns to create consistent visual elevation in user interfaces.
UI design patterns for data collections — grid, list, and table view modes with row/item selection using large hit areas, background color shifts for selected state, and mass action toolbars.
A UI design skill that ensures users always know where they are, what context they're operating in, and what their actions will affect, using visual techniques like breadcrumbs, color regions, section labels, and scope indicators.
A set of practical UX and design system skills for AI agents covering visual hierarchy, typography, accessibility, color systems, responsive layouts, form design, and interaction patterns distilled from enterprise and consumer product experience.
A UX design skill that teaches AI agents how to apply minimal semantic color palettes, handle error recovery, and implement error prevention patterns in user interfaces.
UI patterns for error states, success feedback, and recovery flows — covering toasts, inline errors, banners, and notification designs where every error message includes a clear path to recovery.
Enforces WCAG 2.2 Level AA compliance for UI development as required by the European Accessibility Act, covering color contrast, keyboard navigation, screen reader support, ARIA patterns, and focus management.
Design patterns for placing global settings — currency, language, region, units — in persistent, low-profile locations like header toolbars or footers, keeping them accessible without competing with primary navigation.
UI design patterns for managing wait times — from simple spinners to skeleton screens and staggered animations, optimizing perceived performance so interfaces feel faster than actual load times.
Part of dembrandt's design skills collection, this skill extracts design patterns from existing products covering visual hierarchy, typography, accessibility, and interaction patterns for enterprise and consumer UIs.
A set of opinionated UX and design system skills for AI agents covering hierarchy, typography, accessibility, color modes, responsive paradigms, interaction patterns, and usability heuristics, distilled from experience across enterprise tools, SaaS, financial platforms, and consumer apps.
Skill