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
anthropic pptx
Create, read, edit, and convert PowerPoint (.pptx) files with design guidance and visual QA workflows.
158k · bundle
anthropic canvas-design
Creates visual art in .png and .pdf documents by first generating a design philosophy and then expressing it on a canvas.
158k · bundle
anthropic theme-factory
Apply consistent, professional color palettes and font pairings to presentation slide decks and other artifacts using pre-set themes or custom on-the-fly generation.
158k · bundle
anthropic algorithmic-art
Create algorithmic art by first writing a generative philosophy, then expressing it as p5.js sketches with seeded randomness and interactive parameter exploration.
158k · bundle
anthropic frontend-design
Guides distinctive, intentional visual design for new UI or existing interfaces, covering aesthetic direction, typography, and avoiding templated defaults.
158k · bundle
alirezarezvani landing
Generates a premium single-page HTML landing page with 3D CSS animations, GSAP scroll effects, and mouse-parallax depth. Forces structured intake (product pitch, audience, brand, tone) before generating copy or markup.
20.4k · bundle
alirezarezvani design-system
Onboards brand tokens and generates a 12-token CSS palette for consistent, WCAG-AA-compliant HTML document styling across markdown conversions.
20.4k · bundle
alirezarezvani epic-design
Build cinematic, scroll-driven 2.5D websites with parallax depth, text animations, and premium effects using CSS and JavaScript.
20.4k · bundle
alirezarezvani ui-design-system
Generate design tokens, color palettes, typography scales, component systems, and developer handoff documentation for UI design systems.
20.4k · bundle
alirezarezvani brand-guidelines
Apply, document, or enforce brand guidelines for any product or company, covering color systems, typography, logo usage, brand voice, and visual identity.
20.4k · bundle
alirezarezvani senior-architect
Design system architecture, evaluate microservices vs monolith, create architecture diagrams, analyze dependencies, choose databases, and make technical decisions with architecture decision records.
20.4k · bundle
alirezarezvani demo-video
Create polished demo videos, product walkthroughs, and feature showcases by orchestrating browser rendering, text-to-speech, and video compositing.
20.4k · bundle
addyosmani frontend-ui-engineering
Build production-quality user interfaces that are accessible, performant, and visually polished, with guidance on component architecture, state management, design system adherence, and accessibility.
69.5k
antfu antfu-design
Build interfaces with UnoCSS using semantic tokens, dark mode parity, and design polish for devtools and landing pages.
5.5k · bundle
microsoft frontend-design-review
Review UI implementations against design quality standards and design system compliance, or create distinctive, production-grade frontend interfaces from scratch.
2.7k · bundle
microsoft frontend-ui-dark-ts
Build dark-themed React applications using Tailwind CSS with custom theming, glassmorphism effects, and Framer Motion animations for dashboards, admin panels, or data-rich interfaces.
2.7k · bundle
conardli gpt-image-2
Generates and edits images using GPT Image 2 across three modes: direct generation via OpenAI-compatible API, prompt engineering for host-native image tools, or pure prompt advisory. Includes 80+ structured templates for posters, UI mockups, product visuals, maps, slides, and more.
9.2k · bundle
conardli web-design-engineer
Craft polished visual web artifacts — pages, dashboards, prototypes, slide decks, animations, UI mockups, and data visualizations — using HTML, CSS, JavaScript, and React.
9.2k · bundle
conardli web-video-presentation
Transform articles or scripts into click-driven 16:9 web presentations that look like videos, with optional AI voiceover synthesis.
9.2k · bundle
affaan-m taste
Provides a creative-direction layer for music videos and short-form edits in the angelcore/cloud-trance/hyperpop visual family, encoding aesthetic vocabulary, mood/color/light system, and beat-synced editing grammar to produce intentional, stylistically coherent video content.
226k · bundle
affaan-m ui-to-vue
Batch-convert UI design screenshots into Vue 3 Composition API components using Vant, Element Plus, or Ant Design Vue.
226k
affaan-m manim-video
Create animated technical explainers using Manim for graphs, workflows, system diagrams, and product walkthroughs with precise motion and clear scene planning.
226k · bundle
affaan-m ios-icon-gen
Generate iOS app icons as PNG imagesets for Xcode asset catalogs from SF Symbols or the Iconify API.
226k · bundle
affaan-m accessibility
Design, implement, and audit inclusive digital products using WCAG 2.2 Level AA standards, with guidance for Web, iOS, and Android platforms.
226k
affaan-m design-system
Generate or audit design systems, check visual consistency, and review PRs that touch styling.
226k
affaan-m video-editing
Edit real video footage using a pipeline of FFmpeg, Remotion, ElevenLabs, fal.ai, and traditional editors for cutting, structuring, and augmenting raw captures.
226k
affaan-m frontend-slides
Create zero-dependency, animation-rich HTML presentations from scratch or by converting PowerPoint files, with viewport-fit enforcement and visual style exploration.
226k · bundle
affaan-m motion-advanced
Build complex, interactive animations in React/Next.js including drag-and-drop, gestures, text animations, SVG path drawing, custom hooks, and imperative sequences.
226k
affaan-m motion-patterns
Provides copy-paste animation patterns for React and Next.js, including buttons, modals, toasts, stagger lists, page transitions, scroll reveals, and layout animations, all built on motion-foundations tokens.
226k
affaan-m motion-foundations
Provides a foundational motion system for React/Next.js apps using motion/react, including tokens, spring presets, accessibility enforcement, SSR safety, and performance rules.
226k
affaan-m liquid-glass-design
Implement Apple's Liquid Glass design system for iOS 26+ with dynamic glass materials, blur, reflection, and interactive morphing in SwiftUI, UIKit, and WidgetKit.
226k
coreyhaines31 image
Create and optimize marketing images including blog heroes, social graphics, and ad visuals using AI generation and design tools.
36.3k · bundle
antigravity imagen
Generates images using Google Gemini's image generation model for UI placeholders, documentation, and design assets.
42.4k
antigravity shadcn
Manage shadcn/ui components and projects with context, documentation, and usage patterns for building modern design systems.
42.4k · bundle
antigravity vizcom
Transforms sketches and text descriptions into photorealistic 3D renders for product design, with control over materials, lighting, and style.
42.4k
antigravity lookdev
Builds an interactive in-browser studio for tuning visual parameters (sliders, pickers, drag handles) or editing/annotating text and media, enabling real-time human-in-the-loop refinement instead of static comparisons or chat-based feedback.
42.4k
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 frontend-design, pptx, theme-factory. 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.