Design & Media Agent Skills for Claude Code

Use whenever a task writes or modifies React code, including JSX or TSX components, hooks, React tests, and React code snippets.

UX writing and interface copy, from voice and button labels to error messages and empty states.

Author, extract, and maintain a project's DESIGN.md following the Google design.md spec (https://github.com/google-labs-code/design.md).

Creates the cards of an X / Twitter carousel ad at X's dimensions, as a series of coherent visuals.

Use when the user explicitly asks for a desktop or system screenshot (full screen, specific app or window, or a pixel region), or when…

Creates the X / Twitter profile visuals (profile photo and header / banner) at X's official dimensions.

Generates realistic, customizable X (Twitter) post cards with engagement metrics for video overlays and social sharing.

Creates an image for an X / Twitter post (a tweet image) at X's ratios, in the chosen orientation.

Transforms Chinese articles, video voiceovers, and business workflows into sparse, hand-drawn 4:3 conceptual illustrations and diagrams.

Use when creating retro-grain portrait, fan, or editorial collage posters from user-supplied photos.

Start the dev server, inspect the feature in browser, and iterate on polish.

Customize the ZCode desktop app with a wallpaper and translucent UI theme.

Knowledge and utilities for creating animated GIFs optimized for Slack.

Create beautiful visual art in .png and .pdf documents using design philosophy.

Toolkit for styling artifacts with a theme.

Use when the project has a frontend (`stack.yml.frontend.framework` is set and not `none`) and `docs/03-ux-ui/navigation_map.md` or…

Create high-converting, visually distinctive landing pages.

Create or redesign print-ready A4 posters and notices for events, promotions, culture, education, services, safety, and other subjects.

Brand voice, visual identity, messaging frameworks, asset management, brand consistency.

Build a throwaway prototype to answer a design question.

Use for any UI build request — landing page, dashboard, sidebar, component, auth screen, marketing site, or design iteration.