Design & Media Agent Skills for Claude Code

Playful, character-driven design with expressive typography and bold graphics for landing pages and creative projects.

Run a 5-dimension expert design review on any HTML artifact in the project — Philosophy / Visual hierarchy / Detail / Functionality /…

Apply CSS alpha masking with linear-gradient for horizontal or vertical edge fades (mask-image and -webkit-mask-image).

Scaffold or maintain a project's root stylesheet using the CSS-only light, dark, and system color-mode contract.

Design thematically coherent custom tarot decks by identifying dialectics, creating suits through dialectic cross-products, developing…

How to configure, compose, or eject Agent Native features into app-owned code.

The technique catalog: five velocity-matched SEAMS (zoom-through, INVERSE zoom-through, cut-the-curve, waterfall cut, rack-focus blur-cut)…

Create a recurring daily UI inspiration capture.

Create a dark-blue clean design system with strong contrast, cobalt gradient feature blocks, crisp framed structure, and restrained…

Create a dark glass layout system with frosted premium shells, clean multi-column workspace structure, floating data cards, and restrained…

Use this skill when the user asks to "generate dark mode", "create dark theme", "add dark mode support", "convert to dark mode colors"…

Superdesign is a design agent specialized in frontend UI/UX design.

Evaluate design effectiveness from a UX perspective.

Extract and consolidate reusable components, design tokens, and patterns into your design system.

Strict frontend design guardrails for building modern, minimal-visual-noise, airy, non-generic app UIs.

Conducts comprehensive frontend design reviews covering UI/UX design quality, design system validation, accessibility compliance…

Use when the user wants to design, redesign, shape, critique, audit, polish, clarify, distill, harden, optimize, adapt, animate, colorize…

Design or improve onboarding flows, empty states, and first-time user experiences.

Type-safe React forms with React Hook Form and Zod validation.

Best practices for Remotion - Video creation in React. 29 domain-specific rules covering 3D, animations, audio, captions, charts…

Converts Stitch designs into modular Vite and React components using system-level networking and AST-based validation.