Design & Media Agent Skills for Claude Code

Automate All Images AI tasks via Rube MCP (Composio).

Analyze a Figma frame's structure, properties, and implementation considerations

Build automated Figma-to-React pipeline with the Anima SDK.

Collect Anima SDK debug evidence for support tickets and troubleshooting.

Set up iterative design-to-code development loop with Anima SDK.

Apply production-ready patterns for the Anima SDK design-to-code pipeline.

Upgrade @animaapp/anima-sdk versions and handle API changes.

Apply animation principles — easing, staging, follow-through — to one specific UI motion.

Anime.js adapter patterns for HyperFrames.

Get structured design feedback on usability, hierarchy, and consistency.

Senior product designer and front-end engineer principles for clean, premium, intentional UI.

Core UI/UX engineering skill for building highly interactive, spatial, weightless, and glassmorphism-based web interfaces using GSAP and…

Apple Human Interface Guidelines as 14 agent skills covering platforms, foundations, components, patterns, inputs, and technologies for…

Generate copy-pastable ASCII banners with a built-in font (no external font deps), including compact fallback and optional ANSI 256…

Plan and generate terminal ASCII animations/screensaver-style output (FPS, refresh rules, loop policy, low-flicker guidance), with a…

UI/UX design intelligence with 50+ styles, 161 palettes, 57 font pairings, 99 UX guidelines, and 25 chart types.

Use when applying Atomic Design methodology to organize UI components into quarks, atoms, molecules, organisms, templates, and pages.

Use when building complex organisms from molecules and atoms like headers, footers, product cards, and sidebars.

Use when working with design tokens, CSS custom properties, and primitive values that form the foundation below atoms.

Automate Bannerbear tasks via Rube MCP (Composio).

A visual-design fundamentals course for new brand designers — grid, type, color, and the exercises that build the eye.