- Home
- /
- Categories
- /
- Animation
Animation
UI animations and transitions
frontend-design
by julianromli
Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.
organizational-design
by liqiongyu
"Design or redesign an org structure and operating model by producing an Organizational Design Pack (design brief, current-state map, operating-model decision, target org blueprint, transition plan). Use for org design, reorgs, team topology, functional vs divisional structures, and centralized vs decentralized decision-making. Category: Leadership."
frontend-design
by matteocervelli
Create distinctive, production-grade frontends by composing design dimensions and tech-specific implementations
ui-skills
by vaayne
Opinionated constraints for building better interfaces with agents.
creating-wpf-animations
by christian289
"Creates WPF animations using Storyboard, Timeline, and EasingFunction patterns. Use when implementing UI transitions, state change visualizations, or interactive feedback effects."
defining-wpf-dependencyproperty
by christian289
Defines WPF DependencyProperty with Register, PropertyMetadata, callbacks, and validation. Use when creating custom controls, attached properties, or properties that support data binding and styling.
frontend-design
by bear2u
Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.
frontend-design
by shipshitdev
Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, artifacts, posters, or applications (examples include websites, landing pages, dashboards, React components, HTML/CSS layouts, or when styling/beautifying any web UI). Generates creative, polished code and UI design that avoids generic AI aesthetics.
ai-loading-ux
by shipshitdev
Design AI loading, thinking, and progress indicator UX. Use when explicitly asked to improve AI waiting states, add thinking indicators, or design loading UX for AI interfaces. Covers reasoning display (chain-of-thought), progress steps, streaming states, and the "elevator mirror effect" for reducing perceived wait time.
capacitor-splash-screen
by Cap-go
Guide to configuring splash screens in Capacitor apps including asset generation, animation, and programmatic control. Use this skill when users need to customize their app launch experience.
dribbble-ui-skills
by ihlamury
Dribbble's UI design system. Use when building interfaces inspired by Dribbble's aesthetic - light mode, Inter font, 4px grid.
gumroad-ui-skills
by ihlamury
Gumroad's UI design system. Use when building interfaces inspired by Gumroad's aesthetic - dark mode, Inter font, 4px grid.
github-ui-skills
by ihlamury
GitHub's UI design system. Use when building interfaces inspired by GitHub's aesthetic - dark mode, Inter font, 4px grid.
airtable-ui-skills
by ihlamury
Airtable's UI design system. Use when building interfaces inspired by Airtable's aesthetic - light mode, Inter font, 4px grid.
slack-gif-creator
by smallnest
Toolkit for creating animated GIFs optimized for Slack, with validators for size constraints and composable animation primitives. This skill applies when users request animated GIFs or emoji animations for Slack from descriptions like "make me a GIF for Slack of X doing Y".
liveblocks-ui-skills
by ihlamury
Liveblocks's UI design system. Use when building interfaces inspired by Liveblocks's aesthetic - dark mode, Inter font, 4px grid.
launchdarkly-ui-skills
by ihlamury
Launchdarkly's UI design system. Use when building interfaces inspired by Launchdarkly's aesthetic - dark mode, Inter font, 4px grid.
apple-ui-skills
by ihlamury
Apple's UI design system. Use when building interfaces inspired by Apple's aesthetic - light mode, Inter font, 4px grid.
lemonsqueezy-ui-skills
by ihlamury
Lemonsqueezy's UI design system. Use when building interfaces inspired by Lemonsqueezy's aesthetic - light mode, Inter font, 4px grid.
brex-ui-skills
by ihlamury
Brex's UI design system. Use when building interfaces inspired by Brex's aesthetic - light mode, Inter font, 4px grid.
amplitude-ui-skills
by ihlamury
Amplitude's UI design system. Use when building interfaces inspired by Amplitude's aesthetic - light mode, Inter font, 4px grid.
convertkit-ui-skills
by ihlamury
Convertkit's UI design system. Use when building interfaces inspired by Convertkit's aesthetic - light mode, Inter font, 4px grid.
monzo-ui-skills
by ihlamury
Monzo's UI design system. Use when building interfaces inspired by Monzo's aesthetic - light mode, Inter font, 4px grid.
clerk-ui-skills
by ihlamury
Clerk's UI design system. Use when building interfaces inspired by Clerk's aesthetic - light mode, Inter font, 4px grid.