Skills — 107 composable design capabilities.
Each skill is a single folder with one SKILL.md. Drop it in,
restart the daemon, the picker shows it. Filter by surface, scenario,
or platform below to find the one that matches your brief.
Scenario
Platform
- desktop12
- mobile1
Featured
-
Nº 08 faq-page A Frequently Asked Questions (FAQ) page with collapsible accordion sections, search functionality, and category filtering. Use when the brief asks for "FAQ", "help center", "questions", or "support page".
- Nº 11 hatch-pet
Create, repair, validate, preview, and package Codex-compatible animated pet spritesheets from character art, screenshots, generated images, or visual references. Use when a user wants to hatch a Codex pet, create a custom animated pet, or build a built-in pet asset with an 8x9 atlas, transparent unused cells, row-by-row animation prompts, QA contact sheets, preview videos, and pet.json packaging. This skill composes the installed $imagegen system skill for visual generation and uses bundled scripts for deterministic spritesheet assembly.
- 001 faq-page A Frequently Asked Questions (FAQ) page with collapsible accordion sections,
search functionality, and category filtering. Use when the brief asks for
"FAQ", "help center", "questions", or "support page".
- 002 hatch-pet Create, repair, validate, preview, and package Codex-compatible animated pet spritesheets from character art, screenshots, generated images, or visual references. Use when a user wants to hatch a Codex pet, create a custom animated pet, or build a built-in pet asset with an 8x9 atlas, transparent unused cells, row-by-row animation prompts, QA contact sheets, preview videos, and pet.json packaging. This skill composes the installed $imagegen system skill for visual generation and uses bundled scripts for deterministic spritesheet assembly.
- 003
8-bit-orbit-video-template Hyperframes-based video template for retro pixel deck motion design.
Use when users want a high-fidelity, multi-scene HTML-to-video composition
with advanced transitions, interactive preview controls, and ready-to-render
default style. - 004 ad-creative Generate and iterate ad creative including headlines, descriptions, and primary text. Useful for paid social and search ad iteration.
- 005
after-hours-editorial-template Luxury dark-editorial HyperFrames template for three-page cinematic storyboards,
inspired by haute couture title cards and magazine chapter spreads. Use when the
user asks for premium fashion-style motion pages, moody serif-led storytelling,
or a high-end dark presentation aesthetic with rich transitions. - 006 agent-browser Browser automation CLI for AI agents. Use when the user needs to inspect, test, or automate browser behavior: navigating pages, filling forms, clicking buttons, taking screenshots, extracting page data, testing web apps, dogfooding Open Design previews, QA, bug hunts, or reviewing app quality. Prefer local Open Design preview URLs unless the user explicitly asks for external browsing.
- 007 ai-music-album Full-lifecycle AI music album production — concept, lyric drafting, track sequencing, and export. Useful for indie album experiments and brand soundtracks.
- 008 algorithmic-art Create generative art using p5.js with seeded randomness so every render is reproducible. Useful for procedural posters, motion-style stills, and artistic frame studies.
- 009 apple-hig Apple Human Interface Guidelines as 14 agent skills covering platforms, foundations, components, patterns, inputs, and technologies for iOS, macOS, visionOS, watchOS, and tvOS.
- 010 artifacts-builder Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui).
- 011 brainstorming Transform rough ideas into fully-formed designs through structured questioning and alternative exploration. Useful early in concept work.
- 012 brand-guidelines Apply Anthropic's official brand colors and typography to artifacts for consistent visual identity and professional design standards. A reference for shaping your own.
- 013 canvas-design Create beautiful visual art in PNG and PDF documents using design philosophy and aesthetic principles for posters, illustrations, and static pieces.
- 014 color-expert Color science expert skill with 286K words of reference material covering OKLCH/OKLAB, palette generation, accessibility/contrast, color naming, pigment mixing, and historical color theory.
- 015 competitive-ads-extractor Extract and analyze competitors' ads from ad libraries to understand messaging and creative approaches that resonate.
- 016 copywriting Write and rewrite marketing copy for landing pages, homepages, and ads. Useful as a copy chief partner during launches.
- 017 creative-director AI creative director with recursive self-assessment: 20+ methodologies (SIT, TRIZ, Bisociation, SCAMPER, Synectics), 3-axis evaluation calibrated against Cannes/D&AD/HumanKind, 5-phase process from brief to presentation.
- 018 d3-visualization Teaches the agent to produce D3 charts and interactive data visualizations. Useful for editorial dashboards, reports, and explanatory graphics.
- 019 design-brief Parse a structured design brief written in I-Lang protocol format into a concrete design spec. Eliminates ambiguity from vague requests like "make it professional" by requiring explicit dimensions: palette, typography, layout, mood, density, and constraints. Trigger keywords: "design brief", "create a design brief", "ilang brief", "structured brief".
- 020 design-consultation Build a complete design system from scratch with creative risks and realistic product mockups. Useful for kickoff workshops and brand-from-zero work.
- 021 design-md Create and manage DESIGN.md files. Useful for capturing design direction, tokens, and visual rules in a single source of truth.
- 022 design-review Designer Who Codes: visual audit then fixes with atomic commits and before/after screenshots. Useful for tightening shipped UI before launch.
- 023
digits-fintech-swiss-template Swiss-grid fintech deck template in black / warm paper / neon-lime contrast.
Use when users ask for premium data-story slides with strict modular layout,
bold numeric cards, restrained motion, and keyboard/click navigation in one HTML file. - 024 doc Read, create, and edit .docx documents with formatting and layout fidelity via OpenAI's document skill.
- 025 docx Create, edit, and analyze Word documents with tracked changes, comments, and formatting. Useful for design briefs, copy docs, and review-ready deliverables.
- 026 domain-name-brainstormer Generate creative domain name ideas and check availability across multiple TLDs including .com, .io, .dev, and .ai.
- 027
editorial-burgundy-principles-template Editorial studio deck template in burgundy / blush / muted-gold palette.
Use when users ask for premium manifesto or culture slides with pill tags,
large typographic statements, principle cards, and guided keyboard/click navigation. - 028 enhance-prompt Improve prompts with design specs and UI/UX vocabulary. Useful for design-to-code workflows and clarifying requests for visual output.
- 029 fal-3d Generate 3D models from text or images via fal.ai. Useful for game assets, AR previews, product mockups, and concept sculpting.
- 030 fal-generate Generate images and videos using fal.ai AI models. Production-grade catalogue covering Flux, SDXL, ideogram, and other community-hosted endpoints.
- 031 fal-image-edit AI-powered image editing with style transfer, background removal, object removal, and inpainting via fal.ai hosted models.
- 032 fal-kling-o3 Generate images and videos with Kling O3 — Kling's most powerful model family — via fal.ai.
- 033 fal-lip-sync Create talking head videos and lip sync audio to video via fal.ai. Useful for explainer avatars, multilingual dubbing previews, and social cuts.
- 034 fal-realtime Real-time and streaming AI image generation via fal.ai. Suited for moodboard exploration, draft variations, and rapid creative iteration.
- 035 fal-restore Restore and fix image quality — deblur, denoise, fix faces, and restore old documents using fal.ai's hosted restoration models.
- 036 fal-train Train custom AI models (LoRA) on fal.ai for personalized image generation tailored to a brand, character, or style.
- 037 fal-tryon Virtual try-on — see how clothes look on a person via fal.ai's hosted try-on models. Useful for ecommerce, lookbooks, and styling experiments.
- 038 fal-upscale Upscale and enhance image and video resolution using AI super-resolution models hosted on fal.ai.
- 039 fal-video-edit Edit existing videos using AI — remix style, upscale, remove background, and add audio via fal.ai's hosted video models.
- 040 fal-vision Analyze images — segment objects, detect, run OCR, describe, and answer visual questions via fal.ai vision models.
- 041
field-notes-editorial-template Editorial "Field Notes" report template with soft paper background, serif hero
typography, rounded pastel insight cards, and a retention chart panel.
Use when users ask for a premium magazine-style business report, board memo
one-pager, or elegant data storytelling layout. - 042 figma-code-connect-components Connect Figma design components to code components using Code Connect so design-system updates flow into the codebase automatically.
- 043 figma-create-design-system-rules Generate project-specific design system rules for Figma-to-code workflows. Useful for capturing tokens, naming, and lint rules in one source.
- 044 figma-create-new-file Create a new blank Figma Design or FigJam file. Useful as the first step in scripted design-system or workshop workflows.
- 045 figma-generate-design Build or update screens in Figma from code or description using design system components. Translate app pages into Figma using design tokens.
- 046 figma-generate-library Build or update a professional-grade design system library in Figma from a codebase. Useful for keeping the Figma source of truth in sync with shipped components.
- 047 figma-implement-design Translate Figma designs into production-ready code with 1:1 visual fidelity. Useful for handing off Figma frames straight to a frontend agent.
- 048 figma-use Run Figma Plugin API scripts for canvas writes, inspections, variables, and design-system work. Prerequisite for every other Figma skill in this catalogue.
- 049 flutter-animating-apps Implement animated effects, transitions, and motion in Flutter apps. Useful for native iOS/Android motion design.
- 050 frontend-design Frontend design and UI/UX development tools for shipping production-ready interfaces with strong typographic and layout discipline.
- 051 frontend-dev Full-stack frontend with cinematic animations, AI-generated media via MiniMax API, and generative art. Useful for hero pages and showcase sites.
- 052 frontend-skill Create visually strong landing pages, websites, and app UIs with restrained composition. OpenAI's production frontend playbook.
- 053 frontend-slides Generate animation-rich HTML presentations with visual style previews. Useful for online keynotes, embedded talks, and interactive briefs.
- 054 full-page-screenshot Capture full-page screenshots of web pages via Chrome DevTools Protocol with zero dependencies. Useful for portfolios, case studies, and audit reports.
- 055 gif-sticker-maker Convert photos into animated GIF stickers in Funko Pop / Pop Mart style via the MiniMax API. Useful for personalized chat stickers and avatar packs.
- 056 gsap-core Core GSAP API with gsap.to(), from(), fromTo(), easing, duration, stagger, and defaults. Production-grade web animation primitives.
- 057 gsap-react GSAP React integration with useGSAP hook, refs, gsap.context(), cleanup, and SSR. Ships safe motion in React + Next.js apps.
- 058 gsap-scrolltrigger GSAP ScrollTrigger for scroll-linked animations, pinning, scrub, and refresh handling. Useful for editorial sites and product pages.
- 059 gsap-timeline GSAP Timelines with sequencing, position parameter, labels, nesting, and playback control. Useful for orchestrating multi-step motion sequences.
- 060 hand-drawn-diagrams Generate hand-drawn Excalidraw diagrams from a prompt — animated SVG, hosted edit link, and PNG export. Works with Claude Code, Codex, Gemini CLI, and any agent supporting standard skill paths.
- 061
html-ppt-retro-quarterly-review Retro Quarterly Review presentation template in a bold blue + orange editorial
language. Use when users ask for a high-impact quarterly review / roadmap deck
with heavyweight slab headlines, clean cream paper sections, structured grids,
and fast premium motion pacing (3 slides, each hold under 3s in video mode). - 062 image-enhancer Improve image and screenshot quality by enhancing resolution, sharpness, and clarity for professional presentations and documentation.
- 063 imagegen Generate and edit images using OpenAI's Image API for project assets — UI mockups, icons, illustrations, social cards, and visual references.
- 064 imagen Generate images using Google Gemini's image generation API for UI mockups, icons, illustrations, and visual assets.
- 065
login-flow Mobile login and authentication flow screens - 066 marketing-psychology Apply psychological principles and behavioral science to copy and design. Useful for tightening hooks, framing, and pricing presentation.
- 067 minimax-docx Professional DOCX document creation and editing using OpenXML SDK. Useful for branded reports, polished proposals, and template-based authoring.
- 068 minimax-pdf Generate, fill, and reformat PDFs with a token-based design system and 15 cover styles. Useful for branded PDFs, e-guides, and reports.
- 069 nanobanana-ppt AI-powered PPT generation with document analysis and styled images via the NanoBanana stack. Combines image generation with structured deck output.
- 070 paywall-upgrade-cro Design and optimize upgrade screens, paywalls, and upsell modals. Useful for SaaS conversion design and pricing-page experiments.
- 071 pdf Extract text, create PDFs, and handle forms. Useful for press releases, branded one-pagers, and printable design deliverables.
- 072 pixelbin-media Generate and edit images and videos with an 85+ API portfolio and build visually appealing website pages via Pixelbin.
- 073 plan-design-review Senior Designer review: rates each design dimension 0-10, explains what a 10 looks like, and flags AI Slop signals. Useful as a gate before merging UI work.
- 074 platform-design 300+ design rules from Apple HIG, Material Design 3, and WCAG 2.2 for cross-platform apps. Useful when shipping a single design across iOS, Android, and the web.
- 075 pptx Read, generate, and adjust PowerPoint slides, layouts, and templates. Useful for executive decks, training material, and product reviews.
- 076 pptx-generator Create and edit PowerPoint presentations from scratch with PptxGenJS — MiniMax's production-tested deck pipeline.
- 077 pptx-html-fidelity-audit Audit a python-pptx export against its source HTML deck, identify layout/content drift (footer overflow, cropped content, missing italic/em, lost styling, off-rhythm spacing), and re-export with strict footer-rail + cursor-flow layout discipline. Use this skill whenever the user has a .pptx that was generated from an HTML slide deck and asks to compare/audit/verify/fix the export — including phrases like "compare ppt with html", "fidelity audit", "fix the pptx", "ppt is cut off", "footer overlap", "italic missing in pptx", "re-export the deck", "pptx-html-fidelity-audit", or any case where a python-pptx → HTML round-trip needs verification or repair. Also trigger when the user shows you a deck.html and a deck.pptx side by side and is debugging visual differences.
- 078
release-notes-one-pager Release notes one-page HTML with highlights, Added, Fixed, Breaking changes,
Known issues, and Upgrade note. Writes explicit "None" style sections
whenever the user does not provide details. - 079 remotion Programmatic video creation with React. Useful for branded explainers, social cuts, dashboards-to-video, and reproducible motion graphics.
- 080 replicate Discover, compare, and run AI models using Replicate's API. Strong fit for image, audio, and video generation pipelines that swap models frequently.
- 081 screenshot Capture desktop, app windows, or pixel regions across OS platforms. Useful for marketing screenshots, design reviews, and bug reports.
- 082 screenshots-marketing Generate marketing screenshots with Playwright. Useful for landing-page hero shots, App Store screenshots, and changelog visuals.
- 083 shadcn-ui Build UI components with shadcn/ui. Pairs with the Stitch design loop to ship structured, accessible components quickly.
- 084 shader-dev GLSL shader techniques for ray marching, fluid simulation, particle systems, and procedural generation. Useful for hero visuals and motion stills.
- 085 slack-gif-creator Create animated GIFs optimized for Slack with validators for size constraints and composable animation primitives.
- 086 slides Create and edit .pptx presentation decks with PptxGenJS. Useful for sales decks, kickoff briefs, and design-system showcases.
- 087 sora Generate, remix, and manage short video clips via OpenAI's Sora API. Useful for cinematic shots, b-roll, and rapid concept video iteration.
- 088 speech Generate spoken audio from text using OpenAI's API with built-in voices. Useful for narrated explainers, lecture audio, and quick voiceover tracks.
- 089 stitch-loop Iterative design-to-code feedback loop. Critique → adjust → ship cycle for tightening visual fidelity between brief and built UI.
- 090 swiftui-design SwiftUI 前端设计 skill — anti AI-slop rules, design direction advisor, brand asset protocol, and five-dimension review. Works with Claude Code, Cursor, Codex, and OpenCode.
- 091
swiss-creative-mode-template Swiss-inspired creative-mode presentation template skill with bold editorial
typography, high-contrast geometric cards, interactive slide navigation,
theme switching, hotspot overlays, and palette choreography in a single-file
HTML artifact. Use when users ask for a premium presentation-style landing,
a Swiss/brutalist deck look, or a creative launch page with rich interactions. - 092
swiss-user-research-video-template Swiss-style user-research narrative template in warm-paper editorial aesthetics.
Use when users ask for a premium research deck or story-first live artifact with
minimalist typography, high-clarity layout, subtle motion, donut breakdowns,
and keyboard/click navigation across slides in a single HTML file. - 093 taste-skill High-agency frontend skill that gives AI good taste with tunable design variance, motion intensity, and visual density to stop generic UI slop.
- 094 theme-factory Apply professional font and color themes to artifacts including slides, docs, reports, and HTML landing pages. Ships 10 pre-set themes.
- 095 threejs Three.js skills for creating 3D elements and interactive experiences in the browser — scenes, materials, controls, and post-processing.
- 096 ui-skills Opinionated, evolving constraints to guide agents when building interfaces. Useful for keeping output coherent across many small UI pieces.
- 097 ui-ux-pro-max UI/UX design patterns and best practices. Pattern library + heuristic checks for shipping clean, usable interfaces.
- 098 venice-audio-music Music generation queueing, retrieval, and completion endpoints via Venice.ai. Suited for jingles, background loops, and prototype scoring.
- 099 venice-audio-speech Text-to-speech models, voices, formats, and streaming via Venice.ai. Useful for narration, voiceover, and conversational agent voices.
- 100 venice-image-edit Image edits, upscaling, and background removal via the Venice.ai API.
- 101 venice-image-generate Image generation endpoints and available styles via the Venice.ai API.
- 102 venice-video Video generation and transcription workflows via the Venice.ai API.
- 103 video-downloader Download videos from YouTube and other platforms for offline viewing, editing, or archival with support for various formats and quality options.
- 104 web-artifacts-builder Build complex claude.ai HTML artifacts with React and Tailwind. Anthropic's reference workflow for shipping rich, embeddable artifacts.
- 105 web-design-guidelines Web design guidelines and standards by the Vercel engineering team. Covers layout, typography, color, motion, and accessibility for product UI.
- 106 wpds WordPress Design System. Apply WordPress's official design tokens, typography, and component patterns to themes and sites.
- 107 youtube-clipper YouTube clip generation and editing with automated workflows — pull source video, slice highlights, add captions, and export.