Design AI Skills

Guides creation, revision, and review of Warp- or Oz-branded assets. Use when working on launch pages, docs, HTML/CSS components, UI mockups, prompts, social assets, copy, presentations, or any other…

제품 문서·UX 카피·랜딩 카피를 KO/EN/JA/ZH-CN/ZH-TW 각 언어의 자연스러운 문장으로 다듬되 사실·수치·명령어·링크·브랜드 voice를 보존한다. 'AI 티 없애줘', '번역투 고쳐줘', '문장이 기계적이야', '현지 사용자처럼 다듬어줘', 'humanize this copy' 요청에 사용한다. AI 작성 여부를 판정하거나 탐지 회피를…

将 z-wanghong-handwritten-ppt 生成的王虹学术手写 HTML 直接制作成 16:9 动画 MP4，字形锁定为原 PPT Skill 预览封面的手写字，完整保留字号、颜色、留白、图表和标注，输出零音频流。用户提到动画版王虹PPT、王虹手写动画、Notability手写视频、手写PPT转MP4、学术手写动画、纯画面手写视频、把王虹手写 HTML 做成视频或要求手写风 MP4…

Prepare and select character motion references, or transfer approved motion to a human reference for a later mocap workflow.

Interview you one question at a time, each choice with a recommendation, to settle a big outcome before agents work alone. Use when: selected by name.

Help founders and marketers nail their positioning. Use when someone mentions "positioning," "value proposition," "who is this for," "how do I describe my product," "messaging," "ICP," "ideal…

Color systems for digital products, from building and naming a palette to applying it with meaning and verifying contrast. Use when creating or extending a color palette, naming color tokens, theming…

Refactoring pass — extracts repeated Tailwind class combos and markup into components, and lifts magic values into design tokens. Use when the codebase has obvious duplication, hardcoded hex values or…

This skill applies consistent corporate branding and styling to all generated documents including colors, fonts, layouts, and messaging

Garment blockout, cloth simulation, pin groups, and bake to shape keys or caches for characters and props in Blender via MCP.

Design engineering principles and patterns for building polished, accessible web interfaces. Use this skill when building UI components, reviewing frontend code, implementing forms, handling touch…

Guide teams through Lean UX Canvas v2. Use when framing a business problem, surfacing assumptions, and defining what to learn next.

Help non-designers evaluate work against brand guidelines and know what to fix.

Use when the user wants to design, scaffold, build, or iterate on a video game — including brainstorming new game ideas, planning a gameplay loop, choosing an engine, scaffolding a project, adding…

Turn concepts into static HTML visuals exported as PNG or SVG files via HTML/CSS/SVG. Triggers on: "create an image of", "export as PNG", "save as SVG", "concept to image", "screenshot this HTML". NOT…

A relentless interview to sharpen a plan or design.

Comprehensive Flutter API reference guide covering widgets, Material Design, Cupertino, animations, gestures, navigation, state management, and platform integration. Use when developing Flutter…

Control Rudder's built-in Browser through the separate run-scoped rudder-browser MCP, but invoke this skill only when the user explicitly mentions or selects Rudder's built-in Browser, Rudder Browser,…

Finds out who a brand competes with. Reads what the brand sells from its site, searches the web for the alternatives buyers compare it against, and proposes a shortlist with competitor names and…

Use when deciding whether a process is worth automating, sizing ROI and build-vs-buy, choosing an automation platform, or diagnosing why a fleet of automations keeps breaking — the decision layer…

Implement Gale-Shapley stable matching algorithm for two-sided matching problems. Use this skill when the user needs to match candidates to positions, assign students to schools, or solve any…

Use when user wants a standalone HTML diagram in flat engineering blueprint style — architecture diagrams, system flows, technical spec sheets, component maps. Generates one HTML file using Tailwind…

自定义页面表格批量录入技能。使用 `YidaCodeCanvas` 组件和 antd Table、Input、Select、DatePicker、React hooks 实现草稿、行级校验、分批并发提交和行级错误保留。`YidaCodeCanvas` 组件内不能直接调用 this.utils.yida.*；写入默认消费发布层注入的…

Create production-quality pixel art and animations programmatically. Use when the user asks to "create pixel art", "draw a sprite", "make pixel animation", "generate sprite sheet", "convert image to…

Compares a component or screen's design spec with its code and logs each gap as a build error or spec gap. Use it for design QA, handover review or sign-off: whenever someone asks if a build matches…

Generate comprehensive Product Requirements Documents (PRDs) for product managers. Use this skill when users ask to "create a PRD", "write product requirements", "document a feature", or need help…

Color craft for agent-built interfaces: palette construction in OKLCH, the 60-30-10 discipline, one-accent rule, WCAG 2.2 contrast math, semantic tokens, color-blind-safe pairs, and dark mode mapping.…

Pipeline from a URL or DESIGN.md to tokens, decisions and a UI spec. Use when building UI for an existing brand, auditing a design system or fixing visual inconsistency.

Use this skill when the user requests to generate, create, or make presentations (PPT/PPTX). Creates visually rich slides by generating images for each slide and composing them into a PowerPoint file.

Use when adding, changing, or fixing Roblox animations, particles, beams, trails, tweens, camera shake, or other visual effects.

Generates custom design system rules for the user's codebase. Use when user says "create design system rules", "generate rules for my project", "set up design rules", "customize design system…

marketing-collateral-design — Use when designing, recreating, critiquing, or exporting static marketing collateral such as flyers, social graphics, postcards, brochures, business cards, print ads, and…

Validate and repair source-locked Blender models using named landmarks such as leaf tips, shell corners, eyes, smile, rim thickness, aura center/radius, and view-specific depth markers. Use when…

Use when animation needs to convey feeling, tell a story, or connect emotionally—character moments, dramatic beats, or any motion that should make the audience care.

Generate hierarchical site structure and navigation maps. Creates visual representations of information architecture and content relationships.

Suede AI Co-Marketing Skills. Use when asked to "find co-marketing partners" or plan a joint campaign: evidence-backed fit, reciprocal value, format, roles, consent, shared KPIs and content. NOT FOR:…

Build a Webflow page, section, component, or full site from a Figma design using the Figma MCP and the Webflow MCP (Designer Bridge + Data API). Use whenever translating a Figma file/frame into…

This skill should be used when the user asks "how does this scale", "scale to millions", "scaling roadmap", "where is the bottleneck", "what breaks first", "10x growth", "vertical vs horizontal…

WordPress theme code review and block theme development patterns for WordPress 6.6+. Use when reviewing theme code, auditing theme.json schema, checking template hierarchy, validating block templates,…

Batch-replace backgrounds or recolour SKU variants across a folder of product photos (white background, brand colour, seasonal scene, colour variants) while keeping the product untouched, with resume,…

Screenshot + console sweep + visual inspection of an artifact for layout/color/typography regressions. Silent on pass, reports only on issues. Use after /done reports clean and before end-of-turn.

Flutter-Architektur - Clean Architecture & Best Practices. Use when designing architecture or reviewing code structure.

Design, organize, and manage Helm charts for templating and packaging Kubernetes applications with reusable configurations. Use when creating Helm charts, packaging Kubernetes applications, or…

Plan, generate, inspect, vision-evaluate, refine, and package images and visual assets for game development through a backend-agnostic production loop. Use for PNG or SVG props, icons, characters,…

根据剧情、使用方式与美术方向设计道具形制、结构、材质及多视角/关键细节设定图。用于道具设计、道具资产、道具设定图、道具细节图、prop、物品图；输出静态参考图任务说明与资产合同， 本 Skill 独立完成静态参考图任务说明、资产锁定、审核字段、负向约束和可供后续制作直接读取的资产合同。

Convertkit's UI design system. Use when building interfaces inspired by Convertkit's aesthetic - light mode, Inter font, 4px grid.

Build interactive presentation websites — slide decks projected to a room, controlled by one presenter. Use this skill WHENEVER the user wants to create, build, or design a presentation, slide deck,…

Push design tokens from code INTO Figma as variables — DTCG / tokens.json / a token object → Figma variable collections, modes, and values. Use when the user wants to sync tokens code→Figma: triggers…

Customize Rspress v2 themes with CSS variables, class overrides, Layout slots, icons, or component ejection.

Film a prototype. Turn a canvas board into a live-action clip of a real person using the product -- in an office, a lift, on the street -- with the interface itself kept pixel-exact rather than…

Generate and compare at least five game design solution options for a feature, system, UX issue, live-ops problem, or design challenge. Use when several ideas already exist, when a team needs broader…