Design & Media
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.
-
dvcrn Bundle Gemini Watermark RemoverRemove visible Gemini AI watermarks from images via reverse alpha blending. Use for cleaning Gemini-generated images, removing the star/sparkle logo watermark.
32 -
dvcrn Bundle Style Guide GeneratorGenerate comprehensive website style guides and design systems from URLs, screenshots, and existing documentation. Use this skill when users ask to create a style guide, design system documentation, brand guidelines document, or design specification from a website, app, or existing materials. This skill produces professional PDF outputs following industry-standard style guide structure.
32 -
dvcrn Bundle Design System ComponentsPatterns for building design system components using Surface primitives, CVA variants, and consistent styling. Use when building reusable UI components that follow design token architecture. Triggers on Surface component, CVA, class-variance-authority, component variants, design tokens.
32 -
dvcrn Bundle Conference Poster PitchGenerate elevator pitch for conference posters
32 -
dvcrn Bundle Wangyan Gemini Image GenGenerate, edit, and compose images using Gemini models. Activate when user asks to generate images, draw, create logos/posters/icons/banners, edit/modify photos, combine images, or any image creation task. 画图、生成图片、做图、P图、修图、合成图、做logo、做海报、做图标、做封面、品牌视觉、Nano Banana、Banana。
32 -
dvcrn Bundle Nano Banana Prompting SkillTransform natural language image requests into optimized structured prompts for Gemini image generation. Automatically detects style and builds the perfect prompt — cinematic, illustration, anime, 3D, watercolor, product, and more.
32 -
dvcrn Bundle Distinctive Design SystemsPatterns for creating design systems with personality and distinctive aesthetics. Covers aesthetic documentation, color token architecture, typography systems, layered surfaces, and motion. Use when building design systems that go beyond generic templates. Triggers on design system, design tokens, aesthetic, color palette, typography, CSS variables, tailwind config.
32 -
dvcrn Bundle Terminal UI Design SystemCreate terminal-inspired UI interfaces with macOS-style window decorations, monospace typography, and a warm color palette. Use this skill when building developer tools, code marketplaces, technical documentation sites, or any interface that benefits from a terminal/command-line aesthetic. Provides complete design system specifications including color palette, typography, spacing, components, and CSS implementation details.
32 -
dvcrn Bundle Menu Design GenerationGenerate professional restaurant, cafe, and bar menu designs using each::sense AI. Create print-ready menus, digital displays, QR code menus, and seasonal specials with stunning food photography and elegant typography layouts.
32 -
dvcrn Bundle Uapi Get Daily News Image使用 UAPI 的“每日新闻图”单接口 skill,处理 每日新闻图、新闻海报、每日内容 等请求。 Use when the user wants get daily news image, daily news-image, news-image, daily news image, daily digest, news poster, or when you need to call GET /daily/news-image directly.
32 -
dvcrn Bundle Long Article Illustration长文配图助手。为长篇文章自动划分段落、生成AI配图提示词并调用图像生成工具完成配图。适用场景:(1) 公众号/博客长文需要配图 (2) 用户上传文章希望获得段落配图建议 (3) 批量生成文章插图 (4) 用户提到"文章配图""长文插画""段落配图"等关键词时触发
32 -
dvcrn Skill Openclaw Color PaletteDesign-grade color processing suite — generate harmonious palettes from any seed color, check WCAG 2.1 AA/AAA contrast accessibility, convert between hex/RGB/HSL/HSV/CMYK, simulate 8 color blindness types, and extract dominant colors from images. Use when: (1) user says 'generate a color palette' or 'give me a color scheme for my website', (2) user asks 'check contrast' or 'is this readable' or 'WCAG accessibility', (3) user needs to 'convert hex to RGB' or 'what is #FF5733 in HSL', (4) user wants to 'simulate color blindness' or 'how do colorblind users see this', (5) user requests 'extract colors from image' or 'pull brand colors from this logo'. 6 harmony algorithms, 140 CSS named colors, k-means clustering. Zero install, sub-100ms on Cloudflare Workers. Free + Pro $9/mo.
32 -
dvcrn Bundle Poster Design GenerationGenerate professional poster designs using each::sense AI. Create movie posters, event posters, motivational posters, product launch visuals, vintage designs, travel posters, and more with AI-powered creative generation.
32 -
dvcrn Bundle Nanobanana Image GenerationUse when the user wants to generate or edit images with Google's Nanobanana/Gemini image models using the official Gemini API shape. Prefer this skill for text-to-image, image-to-image editing, multi-image reference workflows, attachment-based recreations, or when the user wants publication-style figures such as materials-science paper schematics. Use it when the user asks for a materials-science figure, journal-style scientific illustration, graphical abstract, mechanism diagram, or paper-ready materials figure.
32 -
dvcrn Bundle Openclaw X Article Cover GeneratorGenerate OpenClaw-themed X (Twitter) article cover images with fixed composition: lobster logo on right quarter, text zone on left three quarters.
32 -
drnabeelkhan Skill Mxm Motion Design AdMaxim motion-design + kinetic typography video — engineered for comprehension-to-conversion via AIDA + Hick's Law. Explainer-ad hybrid that makes complex value props land in under 15 seconds and converts via behavioral-architected CTA.
2 -
nimoqup046-collab Skill Baseline UIValidates animation durations, enforces typography scale, checks component accessibility, and prevents layout anti-patterns in Tailwind CSS projects. Use when building UI components, reviewing CSS utilities, styling React views, or enforcing design consistency.
2 -
nimoqup046-collab Skill Makepad FontCRITICAL: Use for Makepad font and text rendering. Triggers on: makepad font, makepad text, makepad glyph, makepad typography, font atlas, text layout, font family, font size, text shaping, makepad 字体, makepad 文字, makepad 排版, makepad 字形
2 -
nimoqup046-collab Bundle UI UX Pro MaxComprehensive design guide for web and mobile applications. Use when designing new UI components or pages, choosing color palettes and typography, or reviewing code for UX issues.
2 -
nimoqup046-collab Skill Enhance PromptTransforms vague UI ideas into polished, Stitch-optimized prompts. Enhances specificity, adds UI/UX keywords, injects design system context, and structures output for better generation results.
2 -
nimoqup046-collab Skill Product DesignDesign de produto nivel Apple — sistemas visuais, UX flows, acessibilidade, linguagem visual proprietaria, design tokens, prototipagem e handoff. Cobre Figma, design systems, tipografia, cor, espacamento, motion design e principios de design cognitivo.
2 -
nimoqup046-collab Skill Core ComponentsCore component library and design system patterns. Use when building UI, using design tokens, or working with the component library.
2 -
nimoqup046-collab Skill Figma AutomationAutomate Figma tasks via Rube MCP (Composio): files, components, design tokens, comments, exports. Always search tools first for current schemas.
2 -
nimoqup046-collab Skill UI Visual ValidatorRigorous visual validation expert specializing in UI testing, design system compliance, and accessibility verification.
2 -
sakamoto-family-smile Skill Make Interfaces Feel BetterApply concrete design-engineering details that make interfaces feel polished. Use when reviewing or improving UI spacing, typography, borders, shadows, motion, hit areas, icons, text wrapping, and interaction states.
0 -
luokai0 Skill Design MdAnalyze Stitch projects and synthesize a semantic design system into DESIGN.md files
10 -
luokai0 Bundle PPTX PostersCreate research posters using HTML/CSS that can be exported to PDF or PPTX. Use this skill ONLY when the user explicitly requests PowerPoint/PPTX poster format. For standard research posters, use latex-posters instead. This skill provides modern web-based poster design with responsive layouts and easy visual integration.
10 -
luokai0 Bundle Canvas DesignCreate beautiful visual art in .png and .pdf documents using design philosophy. You should use this skill when the user asks to create a poster, piece of art, design, or other static piece. Create original visual designs, never copying existing artists' work to avoid copyright violations.
10 -
luokai0 Bundle Makepad FontCRITICAL: Use for Makepad font and text rendering. Triggers on: makepad font, makepad text, makepad glyph, makepad typography, font atlas, text layout, font family, font size, text shaping, makepad 字体, makepad 文字, makepad 排版, makepad 字形
10 -
luokai0 Bundle FigmaUse the Figma MCP server to fetch design context, screenshots, variables, and assets from Figma, and to translate Figma nodes into production code. Trigger when a task involves Figma URLs, node IDs, design-to-code implementation, or Figma MCP setup and troubleshooting.
10 -
luokai0 Bundle Logo CreatorCreate logos using AI image generation. Discuss style/ratio, generate variations, iterate with user feedback, crop, remove background, and export as SVG. Use when user wants to create a logo, icon, favicon, brand mark, mascot, emblem, or design a logo.
10 -
luokai0 Bundle Stitch Design TasteSemantic 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.
10 -
luokai0 Bundle Stitch DesignUnified entry point for Stitch design work. Handles prompt enhancement (UI/UX keywords, atmosphere), design system synthesis (.stitch/DESIGN.md), and high-fidelity screen generation/editing via Stitch MCP.
10 -
luokai0 Bundle Latex PostersCreate professional research posters in LaTeX using beamerposter, tikzposter, or baposter. Support for conference presentations, academic posters, and scientific communication. Includes layout design, color schemes, multi-column formats, figure integration, and poster-specific best practices for visual communication.
10 -
luokai0 Skill Color Palette ExtractorExtract color palettes from images, websites, or designs. Identifies dominant colors, generates complementary schemes, and exports in multiple formats (HEX, RGB, HSL, Tailwind, CSS variables). Use when users need color schemes from images, brand colors, or design system palettes.
10 -
luokai0 Skill WpdsUse when building UIs leveraging the WordPress Design System (WPDS) and its components, tokens, patterns, etc.
10
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 gemini-watermark-remover, style-guide-generator, design-system-components. Rankings shift as installs change; sort this page by "Most installs" 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@latest add <owner>/<name>, or copy the file into your agent's skills directory.