Design & Media Agent Skills for Claude Code

Premium UI/UX design audit and refinement skill.

Use this skill when aggregating design audit findings across multiple dimensions, deduplicating related issues, or synthesizing results…

Extract design DNA from app screenshots, live URLs, or screen recordings using Google Stitch — color palettes, typography, spacing tokens…

Orchestrates distinct, high-impact visual design directions and UI/UX strategies within Codex Project Autopilot workflows.

Extract design tokens (color / typography / spacing) from imported source code, screenshots, or Figma exports into the canonical token bag…

Transform feature briefs into structured design briefs that give designers the context they need before opening Figma.

Create and manage DESIGN.md files. Useful for capturing design direction, tokens, and visual rules in a single source of truth.

Apple LeanUX++ design workflow, journey schema, emotional arc patterns, and CLI UX patterns.

Replicate the visual style of any website and apply it to your existing codebase.

Define actionable principles that resolve trade-offs when the team disagrees.

Predefined design system references for UI reviews.

Designer Who Codes: visual audit then fixes with atomic commits and before/after screenshots.

Color token contrast computation, framework token paths (Tailwind/MUI/Chakra/shadcn), focus ring validation, WCAG 2.4.13 Focus Appearance…

Create adoption strategy and enablement materials to drive design system usage.

Use this skill when creating or evolving design systems for applications.

Implement premium new frontend landing pages, portfolios, editorial sites, and marketing pages without generic AI styling.

Mockup-to-component pipeline using Google Stitch, 21st.dev, and Storybook MCP.

Define and organise tokens for colour, spacing, type, and elevation with naming and usage rules.

Audit token usage across a product for coverage, drift, and hard-coded values.

Transform design tokens across multiple formats and platforms.

When to activate: design tokens, CSS variables, theming, dark mode, Style Dictionary, token taxonomy, semantic tokens