Skip to content

Design Media Creative Skills

Browse 162 curated design, media & creative skills for AI coding agents. License-verified, MCP-ready, free to start.

Mix Engineer

Polishes raw Suno audio by processing per-stem WAVs (vocals, backing_vocals, drums, bass, guitar, keyboard, strings, brass, woodwinds, percussion, synth, other) with targeted cleanup, EQ, and compression, then remixing into a polished stereo WAV ready for mastering. Use after audio import and before mastering.

#broad-capability#music#audio-generationDesign, Media & Creative

Muapi Logo Creator

Engineer professional-grade brand logos using geometric primitives and negative space — generates minimalist, scalable vector-style marks via muapi.ai

#broad-capability#image-generation#video-generationDesign, Media & Creative

Muapi Social Media Video

Brand-aware social media video creator. Reads brand-identity.md, ICP.md, and messaging.md to write a post/storyboard, craft an optimized Seedance 2.0 Director prompt, generate reference frames with the best available image model, and produce platform-ready video.

#broad-capability#image-generation#video-generationDesign, Media & Creative

Muse

Defining and managing design tokens, applying token systems to existing codebases, and building design system foundations. Covers token architecture for spacing, color, typography, dark mode, and cross-platform output.

#broad-capability#development#securityDesign, Media & Creative

Next Step

Analyzes album state and recommends the optimal next action. Use when the user asks "what should I do next?" or "what's left to do?"

#broad-capability#music#audio-generationDesign, Media & Creative

P5js

p5.js sketches: gen art, shaders, interactive, 3D.

#broad-capability#development#creativeDesign, Media & Creative

Palette

Improving usability, interaction quality, cognitive load reduction, feedback design, and a11y compliance. Use when improving UX usability or interaction feel.

#broad-capability#development#securityDesign, Media & Creative

Penpot Uiux Design

Comprehensive guide for creating professional UI/UX designs in Penpot using MCP tools. Use this skill when: (1) Creating new UI/UX designs for web, mobile, or desktop applications, (2) Building design systems with components and tokens, (3) Designing dashboards, forms, navigation, or landing pages, (4) Applying accessibility standards and best practices, (5) Following platform guidelines (iOS, Android, Material Design), (6) Reviewing or improving existing Penpot designs for usability. Triggers: "design a UI", "create interface", "build layout", "design dashboard", "create form", "design landing page", "make it accessible", "design system", "component library".

#github-copilot#ui#designDesign, Media & Creative

Pixel

Generating pixel-accurate HTML/CSS code from image mockups (PNG/JPG/screenshots) and performing visual verification for faithful reproduction. Use when mockup-to-code generation is needed.

#broad-capability#development#securityDesign, Media & Creative

Pixel Art

Generate pixel art SVG illustrations for READMEs, docs, or slides. Use when user says "画像素图", "pixel art", "make an SVG illustration", "README hero image", or wants a cute visual.

#broad-capability#wanshuiyin-aris#ml-researchDesign, Media & Creative

Pixel Art

Generate pixel art SVG illustrations for READMEs, docs, or slides. Use when user says "画像素图", "pixel art", "make an SVG illustration", "README hero image", or wants a cute visual.

#broad-capability#wanshuiyin-aris#ml-researchDesign, Media & Creative

Pixel Art

Pixel art w/ era palettes (NES, Game Boy, PICO-8).

#broad-capability#development#creativeDesign, Media & Creative

Podcast Generation

Generate AI-powered podcast-style audio narratives using Azure OpenAI's GPT Realtime Mini model via WebSocket. Use when building text-to-speech features, audio narrative generation, podcast creation from content, or integrating with Azure OpenAI Realtime API for real audio output. Covers full-stack implementation from React frontend to Python FastAPI backend with WebSocket streaming.

#broad-capability#development#setupDesign, Media & Creative

Podcast Producer

Produce a podcast episode end-to-end — from planning and scripting through recording, editing, show notes, chapter markers, metadata, promotional clips, and final quality validation.

#podcast#audio-production#editingDesign, Media & Creative

Popular Web Designs

54 real design systems (Stripe, Linear, Vercel) as HTML/CSS.

#broad-capability#development#creativeDesign, Media & Creative

Power BI Visualization Expert Mode

Expert Power BI report design and visualization guidance using Microsoft best practices for creating effective, performant, and user-friendly reports and dashboards.

#github-copilot#data#visualizationDesign, Media & Creative

Pre Generation Check

Validates all pre-generation gates before sending tracks to Suno. Checks sources verified, lyrics reviewed, pronunciation resolved, explicit flag set, style prompt complete, and artist names cleared. Use before generating tracks on Suno or when the user says "pre-gen check" or "ready to generate".

#broad-capability#music#audio-generationDesign, Media & Creative

Premium Frontend UI

A comprehensive guide for GitHub Copilot to craft immersive, high-performance web experiences with advanced motion, typography, and architectural craftsmanship.

#github-copilot#ui#designDesign, Media & Creative

Pretext

Use when building creative browser demos with @chenglou/pretext — DOM-free text layout for ASCII art, typographic flow around obstacles, text-as-geometry games, kinetic typography, and text-powered generative art. Produces single-file HTML demos by default.

#broad-capability#development#creativeDesign, Media & Creative

Pronunciation Specialist

Scans lyrics for pronunciation risks and prevents Suno mispronunciations. Use when writing lyrics with proper nouns, technical terms, homographs, or non-English words.

#broad-capability#music#audio-generationDesign, Media & Creative

Prose

Writing user-facing UX text including microcopy, error messages, voice and tone design, onboarding copy, and accessibility text. Use when UX writing or content strategy is needed.

#broad-capability#development#securityDesign, Media & Creative

Redesign Existing Projects

Upgrades existing websites and apps to premium quality. Audits current design, identifies generic AI patterns, and applies high-end design standards without breaking functionality. Works with any CSS framework or vanilla CSS.

#work-life#productivity#designDesign, Media & Creative

Remotion Best Practices

Best practices for Remotion - Video creation in React

#broad-capability#agent-skills#designDesign, Media & Creative

Replay UX Research

Analyze Sentry session replays to surface UX patterns, pain points, and user journeys for a given product area. Use when asked to "show me how users use", "day in the life", "UX research", "replay research", "how do customers use", "what's the user experience like for", "watch replays of", "analyze replays for", "user behavior on", or "replay UX audit" for any Sentry product surface.

#observability#sentry#uxDesign, Media & Creative

Setup

Detects your Python environment and guides you through installing plugin dependencies. Use on first-time setup or when MCP server fails to start.

#broad-capability#music#audio-generationDesign, Media & Creative

SE: UX Designer

Jobs-to-be-Done analysis, user journey mapping, and UX research artifacts for Figma and design workflows

#github-copilot#ux#designDesign, Media & Creative

Sheet Music Publisher

Converts mastered audio to sheet music and creates printable songbooks. Use after mastering when the user wants sheet music or a songbook for their album.

#broad-capability#music#audio-generationDesign, Media & Creative

Sketch

Throwaway HTML mockups: 2-3 design variants to compare.

#broad-capability#development#creativeDesign, Media & Creative

Sketch

Generating AI image-generation code using the Gemini API. Handles text-to-image generation, image editing, and prompt optimization. Use when image generation code is needed.

#broad-capability#development#securityDesign, Media & Creative

Slack Gif Creator

Knowledge and utilities for creating animated GIFs optimized for Slack. Provides constraints, validation tools, and animation concepts. Use when users request animated GIFs for Slack like "make me a GIF of X doing Y for Slack."

#broad-capability#agent-skills#designDesign, Media & Creative

Slack Gif Creator

Toolkit for creating animated GIFs optimized for Slack, with validators for size constraints and composable animation primitives. This skill applies when users request animated GIFs or emoji animations for Slack from descriptions like "make me a GIF for Slack of X doing Y".

#animationDesign, Media & Creative

Snipgrapher

Configures and uses snipgrapher to generate polished code snippet images, including syntax-highlighted PNGs, SVGs, and WebP exports with custom themes, profiles, and styling options. Use when the user wants to create code screenshots, turn code into shareable images, generate pretty code snippets for docs or social posts, produce syntax-highlighted images from source files, or explicitly mentions snipgrapher. Supports single-file renders, batch jobs, watch mode, and reusable named profiles via the snipgrapher CLI or npx.

#nodejs#design#codeDesign, Media & Creative

Social Video Folder Autocutter

Plan repeatable hard-drive folder-to-video pipelines for speaker-led multicam content, including 9:16 Reels/Shorts up to 3 minutes at 1.1x talking speed and 16:9 long-form 3-7 minute cuts, with Resolve handoff, Editframe asset generation, audio/caption gates, and narrative beat planning.

#broad-capability#davinci-resolve#video-editingDesign, Media & Creative

Songsee

Audio spectrograms/features (mel, chroma, MFCC) via CLI.

#work-life#productivity#personal-productivityDesign, Media & Creative

Songwriting And AI Music

Songwriting craft and Suno AI music prompts.

#broad-capability#development#creativeDesign, Media & Creative

Speech

Use when the user asks for text-to-speech narration or voiceover, accessibility reads, audio prompts, or batch speech generation via the OpenAI Audio API; run the bundled CLI (`scripts/text_to_speech.py`) with built-in voices and require `OPENAI_API_KEY` for live calls. Custom voice creation is out of scope.

#broad-capability#creative#audioDesign, Media & Creative

Spotify Player

Terminal Spotify playback/search via spogo (preferred) or spotify_player.

#broad-capability#browser#automationDesign, Media & Creative

Stepfun TTS

Generate Chinese / Japanese speech with StepFun's stepaudio-2.5-tts — Contextual TTS that replaces step-tts-2's `voice_label` with natural-language `instruction` (≤200 chars) plus inline `()` parentheses for句内 prosody. Use when the user wants emotional / prosody control over voice synthesis (whisper, pause, stress, mood pivot mid-sentence), batch-generates game / app voice lines, migrates from `step-tts-2` (the `voice_label → instruction` breaking change), or hits StepFun's stricter 2.5-era censorship (死/消失/political terms). Triggers on 阶跃 TTS, StepAudio 合成, 语音合成, 配音, 文本转语音, TTS 升级, 迁移 step-tts-2. For transcription with the sibling stepaudio-2.5-asr model, use the stepfun-asr skill instead.

#broad-capability#research#documentsDesign, Media & Creative

Stitch Design Taste

Semantic Design System Skill for Google Stitch. Generates agent-friendly DESIGN.md files that enforce premium, anti-generic UI standards — strict typography, calibrated color, asymmetric layouts, perpetual micro-motion, and hardware-accelerated performance.

#work-life#productivity#designDesign, Media & Creative

Suno Engineer

Constructs technical Suno V5/V5.5 style prompts, selects genres, and optimizes generation settings. Use when creating or refining Suno prompts for track generation.

#broad-capability#music#audio-generationDesign, Media & Creative

Touchdesigner MCP

Control a running TouchDesigner instance via twozero MCP — create operators, set parameters, wire connections, execute Python, build real-time visuals. 36 native tools.

#broad-capability#development#creativeDesign, Media & Creative

Transloadit Media Processing

Process media files (video, audio, images, documents) using Transloadit. Use when asked to encode video to HLS/MP4, generate thumbnails, resize or watermark images, extract audio, concatenate clips, add subtitles, OCR documents, or run any media processing pipeline. Covers 86+ processing robots for file transformation at scale.

#github-copilot#media#workflowsDesign, Media & Creative

Tvos Design Guidelines

Apple Human Interface Guidelines for Apple TV. Use when building tvOS apps with focus-based navigation, Siri Remote input, or living room viewing experiences. Triggers on tasks involving Apple TV, tvOS, 10-foot UI, or media playback.

#work-life#productivity#designDesign, Media & Creative

Typography Selector

Browse and select fonts from Google Fonts or curated pairings. Use to find the perfect typography for a design project.

#typographyDesign, Media & Creative

UI Designer

Extract design systems from reference UI images and generate implementation-ready UI design prompts. Use when users provide UI screenshots/mockups and want to create consistent designs, generate design systems, or build MVP UIs matching reference aesthetics.

#broad-capability#research#documentsDesign, Media & Creative

UI UX Pro Max

UI/UX design intelligence for web and mobile. Includes 50+ styles, 161 color palettes, 57 font pairings, 161 product types, 99 UX guidelines, and 25 chart types across 10 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui, and HTML/CSS). Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, and check UI/UX code. Projects: website, landing page, dashboard, admin panel, e-commerce, SaaS, portfolio, blog, and mobile app. Elements: button, modal, navbar, sidebar, card, table, form, and chart. Styles: glassmorphism, claymorphism, minimalism, brutalism, neumorphism, bento grid, dark mode, responsive, skeuomorphism, and flat design. Topics: color systems, accessibility, animation, layout, typography, font pairing, spacing, interaction states, shadow, and gradient. Integrations: shadcn/ui MCP for component search and examples.

#broad-capability#agent-skills#designDesign, Media & Creative

UI UX Pro Max

UI/UX design intelligence for web and mobile. Includes 50+ styles, 161 color palettes, 57 font pairings, 161 product types, 99 UX guidelines, and 25 chart types across 10 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui, and HTML/CSS). Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, and check UI/UX code. Projects: website, landing page, dashboard, admin panel, e-commerce, SaaS, portfolio, blog, and mobile app. Elements: button, modal, navbar, sidebar, card, table, form, and chart. Styles: glassmorphism, claymorphism, minimalism, brutalism, neumorphism, bento grid, dark mode, responsive, skeuomorphism, and flat design. Topics: color systems, accessibility, animation, layout, typography, font pairing, spacing, interaction states, shadow, and gradient. Integrations: shadcn/ui MCP for component search and examples.

#work-life#productivity#ui-uxDesign, Media & Creative

User Journeys

User experience flows - journey mapping, UX validation, error recovery

#claude-bootstrap#bootstrap#uxDesign, Media & Creative

UX Researcher Designer

UX research and design toolkit for Senior UX Designer/Researcher including data-driven persona generation, journey mapping, usability testing frameworks, and research synthesis. Use when conducting user research, creating personas, mapping user journeys, planning usability tests, or validating designs.

#work-life#productivity#businessDesign, Media & Creative

Venice Image Edit

Transform existing images with Venice. Covers POST /image/edit (prompt-driven single-image edit), /image/multi-edit (compose 1-3 images), /image/upscale (2-4x upscale + enhance), and /image/background-remove. Accepts base64, file upload, or HTTPS URL.

#broad-capability#image-generation#video-generationDesign, Media & Creative

Venice Image Generate

Generate images with Venice. Covers POST /image/generate (Venice-native), POST /images/generations (OpenAI-compatible), GET /image/styles (style presets), request fields (prompt, dimensions, cfg_scale, seed, variants, style_preset, aspect_ratio, resolution, safe_mode, watermark), and response formats.

#broad-capability#image-generation#video-generationDesign, Media & Creative

Venice Video

Generate and transcribe videos via Venice. Covers the async /video/quote + /video/queue + /video/retrieve + /video/complete loop, text-to-video, image-to-video, video-to-video (upscale), audio input, reference images, scene and element support, plus /video/transcriptions for YouTube URLs.

#broad-capability#image-generation#video-generationDesign, Media & Creative

Video Comparer

This skill should be used when comparing two videos to analyze compression results or quality differences. Generates interactive HTML reports with quality metrics (PSNR, SSIM) and frame-by-frame visual comparisons. Triggers when users mention "compare videos", "video quality", "compression analysis", "before/after compression", or request quality assessment of compressed videos.

#broad-capability#research#documentsDesign, Media & Creative

Videodb

See, Understand, Act on video and audio. See- ingest from local files, URLs, RTSP/live feeds, or live record desktop; return realtime context and playable stream links. Understand- extract frames, build visual/semantic/temporal indexes, and search moments with timestamps and auto-clips. Act- transcode and normalize (codec, fps, resolution, aspect ratio), perform timeline edits (subtitles, text/image overlays, branding, audio overlays, dubbing, translation), generate media assets (image, audio, video), and create real time alerts for events from live streams or desktop capture.

#broad-capability#video#productionDesign, Media & Creative

Video Studio

Use when the user asks to create or edit videos end-to-end (script→video, auto-cut/jumpcut, captions/subtitles, polishing for Shorts/Reels/TikTok). Current implemented backend: local FFmpeg (probe/render/jumpcut/burn-subtitles/polish). Planned/optional backends: Remotion (motion graphics templates), VectCutAPI (CapCut/剪映 timeline editing), and video-audio-mcp (MCP tool wrapper) when available. Produces a finished video artifact (MP4 by default) from assets + copy + a design/storyboard plan.

#broad-capability#creative#videoDesign, Media & Creative

Video Use

Edit any video by conversation. Transcribe, cut, color grade, generate overlay animations, burn subtitles — for talking heads, montages, tutorials, travel, interviews. No presets, no menus. Ask questions, confirm the plan, execute, iterate, persist. Production-correctness rules are hard; everything else is artistic freedom.

#broad-capability#video-editing#transcriptsDesign, Media & Creative

Vision

Directing UI/UX creative work — complete redesigns, new designs, and trend application. Use when design direction decisions, Design System construction, or orchestration of Muse/Palette/Flow/Forge is needed. Does not write code.

#broad-capability#development#securityDesign, Media & Creative

Visionos Design Guidelines

Apple Human Interface Guidelines for Apple Vision Pro. Use when building spatial computing apps, implementing eye/hand input, or designing immersive experiences. Triggers on tasks involving visionOS, RealityKit, spatial UI, or mixed reality.

#work-life#productivity#designDesign, Media & Creative

Visual Design Foundations

Apply typography, color theory, spacing systems, and iconography principles to create cohesive visual designs. Use when establishing design tokens, building style guides, or improving visual hierarchy and consistency.

#broad-capability#engineering#agent-skillsDesign, Media & Creative

Web Design Engineer

Build polished visual web artifacts with HTML/CSS/JavaScript/React: pages, dashboards, prototypes, slide decks, animations, UI mockups, and data visualizations. Use when the user wants a browser-rendered, interactive, or presentational front-end deliverable. Not for back-end, CLI, or non-visual coding tasks.

#broad-capability#web-design#image-generationDesign, Media & Creative

Youtube Clipper

YouTube 视频智能剪辑工具。下载视频和字幕,AI 分析生成精细章节(几分钟级别), 用户选择片段后自动剪辑、翻译字幕为中英双语、烧录字幕到视频,并生成总结文案。 使用场景:当用户需要剪辑 YouTube 视频、生成短视频片段、制作双语字幕版本时。 关键词:视频剪辑、YouTube、字幕翻译、双语字幕、视频下载、clip video

#broad-capability#op7418-youtube-clipper#videoDesign, Media & Creative

Youtube Downloader

Download YouTube videos and HLS streams (m3u8) from platforms like Mux, Vimeo, etc. using yt-dlp and ffmpeg. Use this skill when users request downloading videos, extracting audio, handling protected streams with authentication headers, or troubleshooting download issues like nsig extraction failures, 403 errors, or cookie extraction problems.

#broad-capability#research#documentsDesign, Media & Creative