Design & Media Agent Skills for Claude Code

Create an eight-piece animated sticker pack workflow from a reference character or an existing 4×2 board: prepare the identity-consistent…

Author, review, or batch-produce SVG icon hover gestures and icon↔icon morphs (Hugeicons/Lucide/Phosphor).

Create an on-scroll animation trigger using IntersectionObserver with Tailwind-friendly animation classes and keyframes.

Reverse-engineer any motion reference (a video from X/Twitter, Dribbble, a screen recording, a GIF) into production animation code through…

Creates or continues an editable Figma annotation composition around a clean showcase screenshot, hands it to a person for visual…

Creates or continues an editable annotation composition in a local pen.dev `.pen` file through Pencil MCP tools, hands it to a person for…

Structured, enterprise-focused design system emphasizing clarity, consistency, and efficiency for data-dense web applications.

Applies official Anthropic brand colors, typography, and visual styling standards to documents, presentations, and design artifacts.

Stop Codex, GitHub Copilot, Claude Code, and Cursor from shipping generic UI.

Apple-inspired clean, minimal, premium UI design.

Transform user-supplied architecture, streetscape, interior, landscape-architecture, and urban-view photos into faithful 9:16…

Use this skill when building or refactoring React interfaces with Ariakit, especially dialogs, menus, popovers, comboboxes, tabs, select…

UI/UX best practices and accessibility audit.

Create a dark atmospheric background with drifting vertical light folds, screen-blended glow, and a concentrated luminous corner or…

Auditing a design system: the 7 mistakes that kill interface systems, and the AI-ready test (can your AI tools keep up with your…

Use when reviewing or changing a React, Next.js, Tailwind, or shadcn interface and you need evidence-backed findings for accessibility…

Use when you need high-quality stock-style images from Aura Assets (aura.build/assets) similar to Unsplash for design mockups and…

Use when designing or polishing the visual quality of an Avalonia app — choosing themes, building a design system, crafting beautiful…

Elite frontend orchestrator — slams the full design stack together for Awwwards-tier, blow-my-mind UI work.

Create or redesign distinctive, content-rich, taste-calibrated B2B brand and corporate marketing websites as standalone HTML, CSS, and…

Create a perspective WebGL background grid with fading lines, subtle particle haze, slow forward drift, and gentle camera parallax.