Design & Media Agent Skills

Design agent skills guide AI agents through visual and UX work: UI mockups, design systems, image and asset workflows, and design reviews. A skill keeps the agent aligned with your design language instead of improvising a new style each session.

Design & Media

983 skills
google-labs-code
stitch-extract-design-md
Reverse-engineer a design system from frontend source code by analyzing component files, stylesheets, Tailwind configs, theme definitions, and design tokens to produce a comprehensive DESIGN.md document.
6.4k · bundle
google-labs-code
enhance-prompt
Transforms vague UI ideas into polished, Stitch-optimized prompts by enhancing specificity, adding UI/UX keywords, injecting design system context, and structuring output for better generation results.
6.4k · bundle
adobe
audit
Audits a website from three perspectives—design, SEO/technical, and LLM/AI-search visibility—and produces a scored, evidence-bound report with prioritized improvements.
142 · bundle
adobe
deploy
Convert per-page styled HTML prototypes into Edge Delivery Services blocks and content pages, then deploy via DA.
142 · bundle
adobe
direct
Analyzes a website's current design and user intent to produce a structured redesign specification, including product and design documents, a design system JSON, and a reasoning trace.
142 · bundle
adobe
uplift
Redesign a website page for presales by extracting its brand surface, identifying tensions, and generating three differentiated variants with motion validation.
142 · bundle
adobe
extract
Crawl a live website, extract its design system, brand surface, and page inventory, and save the snapshot under stardust/current/ for downstream redesign or migration.
142 · bundle
adobe
stardust
Guided multi-page redesign of an existing website through a four-phase pipeline — extract, direct, prototype, and migrate. Tracks progress incrementally per page so redesigns are resumable.
142 · bundle
adobe
whitepaper
Converts Markdown files into professionally typeset PDF whitepapers using pandoc and typst.
142 · bundle
adobe
appbuilder-ui-scaffolder
Generate React Spectrum UI components for Adobe Experience Cloud Shell SPAs and AEM UI Extensions, including pages, forms, data tables, dialogs, and navigation.
142 · bundle
adobe
adobe-edit-quick-cut
Creates three AI-edited sizzle reel variations from a user-uploaded video, letting the user choose their preferred cut.
142
adobe
adobe-retouch-portraits
Bulk-retouch a folder of portrait photos using Adobe tools — designed for wedding photographers and event photographers who need fast, walk-away batch processing.
142
adobe
adobe-design-from-template
Create visual designs like flyers, posters, social media posts, and business cards by searching Adobe Express templates and customizing text, colors, and animations.
142
adobe
adobe-create-pdfs-from-data
Merges CSV/TSV data with an InDesign template to generate personalized PDFs like certificates, badges, and catalogs.
142
adobe
adobe-create-social-variations
Resize, crop, or export any image or video into platform-ready social media assets using Adobe Creative Cloud tools.
142
github
drawio
Generate draw.io diagrams as .drawio files and export them to PNG, SVG, or PDF with embedded XML.
36.2k · bundle
github
freecad-scripts
Generate production-quality Python scripts for FreeCAD CAD application, covering geometry creation, parametric objects, GUI tools, and automation.
36.2k · bundle
github
rhino3d-scripts
Write, edit, and debug scripts for Rhinoceros 3D (Rhino 8+), covering RhinoPython, RhinoScript/VBScript, RhinoCommon .NET, and command macros for automating modeling tasks.
36.2k · bundle
github
screen-recording
Create annotated animated GIF demos and screen recordings for pull requests and documentation. Covers frame capture, timing, imageio-based GIF creation, and per-frame annotation workflows.
36.2k
github
image-annotations
Add visual callouts like rectangles, arrows, and labels to screenshots, diagrams, and images using PIL/Pillow, with support for animated GIF annotations.
36.2k
github
penpot-uiux-design
Create professional UI/UX designs in Penpot using MCP tools, with guidance on design systems, accessibility, and platform guidelines.
36.2k · bundle
github
premium-frontend-ui
Generates immersive, high-performance web interfaces with advanced motion design, typography, and architectural craftsmanship.
36.2k
github
web-design-reviewer
Visually inspect websites to identify and fix design issues including layout, responsive, accessibility, and visual consistency problems at the source code level.
36.2k · bundle
github
legacy-circuit-mockups
Generate breadboard circuit mockups and visual diagrams for retro computing and electronics projects using HTML5 Canvas.
36.2k · bundle
github
draw-io-diagram-generator
Generate, edit, and validate draw.io diagram files (.drawio) with correct mxGraph XML structure for flowcharts, architecture, sequence, ER, and UML diagrams.
36.2k · bundle
github
mcp-create-adaptive-cards
Add Adaptive Card response templates to MCP-based API plugins for visual data presentation in Microsoft 365 Copilot.
36.2k
github
adobe-illustrator-scripting
Write, debug, and optimize Adobe Illustrator automation scripts using ExtendScript (JavaScript/JSX). Covers the complete object model, coordinate system, measurement units, export workflows, and best practices.
36.2k · bundle
github
excalidraw-diagram-generator
Generate Excalidraw diagrams from natural language descriptions, supporting flowcharts, relationship diagrams, mind maps, architecture diagrams, and more. Outputs .excalidraw JSON files that can be opened directly in Excalidraw.
36.2k · bundle
github
gsap-framer-scroll-animation
Build scroll animations, parallax effects, pinned sections, and scroll-triggered reveals using GSAP ScrollTrigger or Framer Motion in vanilla JS, React, or Next.js.
36.2k · bundle
github
power-bi-report-design-consultation
Guides the design of effective, user-friendly, and accessible Power BI reports with optimal chart selection and layout design.
36.2k
greensock
gsap-plugins
Register and use GSAP plugins including ScrollToPlugin, ScrollSmoother, Flip, Draggable, Inertia, Observer, SplitText, ScrambleText, SVG plugins, and custom easing plugins.
10.9k
greensock
gsap-timeline
Sequence and choreograph multi-step animations using GSAP timelines, including nesting, labels, position parameter, and playback control.
10.9k
greensock
gsap-performance
Optimize GSAP animations for smooth 60fps by preferring transforms, avoiding layout thrashing, using will-change, batching reads and writes, and following best practices for stagger, quickTo, and ScrollTrigger performance.
10.9k
greensock
gsap-scrolltrigger
Create scroll-driven animations with pinning, scrubbing, and trigger-based timelines using GSAP ScrollTrigger.
10.9k
vercel-labs
web-design-guidelines
Review UI code for compliance with web interface guidelines, including accessibility and UX best practices.
28.7k
minimax-ai
shader-dev
Create real-time GLSL shader effects including ray marching, SDF modeling, fluid simulation, particle systems, procedural generation, and post-processing with 36 documented techniques.
12.9k · bundle

Frequently asked questions

What are Design & Media agent skills?

Design agent skills guide AI agents through visual and UX work: UI mockups, design systems, image and asset workflows, and design reviews. A skill keeps the agent aligned with your design language instead of improvising a new style each session.

Which Design & Media skills are most installed?

Popular Design & Media skills on SkillMD right now include web-design-reviewer, direct, drawio. Rankings shift as installs change; sort this page by "Most downloaded" for the live list.

Do Design & Media skills work with Claude Code and Cursor?

Yes. Every skill here ships as a SKILL.md file, an open format that works in Claude Code, Claude.ai, Cursor, Codex, Windsurf, and 60+ other agents. Install one with npx skillmds add <owner>/<name>, or copy the file into your agent's skills directory.