Design: skills, plugins, subagents, slash commands and mcp servers

frontend-design sickn33 skill Teaches the agent to create memorable interfaces instead of generic layouts: picks an aesthetic direction, checks accessibility, writes clean code. Claude Code CX Codex Cursor +1 2,600installs manim-video SHL0MS, Hermes Agent skill Builds Manim CE projects for math, algorithm, and technical animations. Useful when an AI agent needs to turn an explanation into a rendered video. Claude Code CX Codex Cursor +1 455installs design-guide paperclipai skill This skill defines Paperclip rules for UI components, tokens, typography, and status systems. Use it when building or changing frontend pages. Claude Code CX Codex Cursor +1 362installs hairline-create lucasmarkes skill Generates interactive isometric line figures using the Hairline engine and outputs them as self-contained HTML files. Claude Code CX Codex Cursor +1 5,000installs lottie-bodymovin calesthio skill Applies Disney's 12 animation principles to Lottie vector animations. Bridges After Effects setup with runtime JavaScript controls. Claude Code CX Codex Cursor +1 1,100installs remotion-best-practices vercel-labs skill This skill gives coding agents Remotion guidance for React projects, from animation and audio to compositions and video parameters. Use it while building or editing Remotion code. Claude Code CX Codex Cursor +1 1,500installs baoyu-infographic 宝玉 (JimLiu) skill A skill that generates infographics by combining 21 layouts with 21 visual styles. Feed it text, data, or a URL and get a structured visual summary in the format you choose. Claude Code CX Codex Cursor +1 440installs api-designer https://github.com/Jeffallan skill Skill for REST and GraphQL API architecture with OpenAPI 3.1 specification generation. Models resources, plans versioning strategies, and establishes error handling standards. Claude Code CX Codex Cursor +1 6,500installs ascii-video SHL0MS, Hermes Agent skill Converts video, audio, and images into colored ASCII video (MP4, GIF). Supports audio-reactive visualization, generative animation, and text overlays. Claude Code CX Codex Cursor +1 435installs startup-canvas phuryn skill A skill that generates a Startup Canvas for new products, combining a 9-section Product Strategy with Business Model (costs and revenue). Use it when launching a product or testing a startup idea. Claude Code CX Codex Cursor +1 3,200installs frontend-dev MiniMax-AI skill Orchestrates frontend development, motion design, AI-generated media, and conversion copy. Built for landing pages, marketing sites, and dashboards. Claude Code CX Codex Cursor +1 3,200installs excalidraw Hermes Agent skill Creates .excalidraw files for architecture diagrams, flowcharts, and sequence diagrams. Use it when you want an agent to turn a system or process into an editable diagram. Claude Code CX Codex Cursor +1 412installs customer-journey-map phuryn skill Builds an end-to-end customer journey map with stages, touchpoints, emotions, pain points, and opportunities. Useful for experience research and onboarding work. Claude Code CX Codex Cursor +1 3,100installs gpui-kit-design-guides longbridge skill Supplies normative desktop interface rules for GPUI Kit applications. Useful when creating new screens, styling components, or auditing UI against review checklists. Claude Code CX Codex Cursor +1 959installs threejs-postprocessing calesthio skill This skill helps an agent add Three.js post-processing such as glow, blur, depth of field, and screen effects. Use it when building a scene’s visual pipeline. Claude Code CX Codex Cursor +1 1,000installs flux-best-practices Black Forest Labs skill Prompting guide for BFL FLUX.1 and FLUX.2 image models. Helps format scene descriptions, handle typography, and pick the right model. Claude Code CX Codex Cursor +1 1,000installs sketch Hermes Agent (adapted from gsd-build/get-shit-done) skill Generates 2-3 HTML mockup variants to compare design directions before you commit to production code. Claude Code CX Codex Cursor +1 402installs user-personas phuryn skill Generates three detailed user personas from research data with jobs-to-be-done, pains, and behavioral insights. Helps teams segment research findings for product decisions. Claude Code CX Codex Cursor +1 3,000installs brainstorm-ideas-existing phuryn skill Skill to brainstorm product ideas for an existing product from PM, Designer, and Engineer perspectives. Use it to generate features, solve identified opportunities, or ideate with your product trio. Claude Code CX Codex Cursor +1 3,000installs logo-generator op7418 skill Generates SVG logos with at least six design variants and creates high-end showcase images using 12 professional background styles via Gemini API. Claude Code CX Codex Cursor +1 3,900installs superdesign superdesigndev skill Create and refine interfaces, presentations, and graphics on the Superdesign canvas. Useful for drafting new layouts or comparing results from different models. Claude Code CX Codex Cursor +1 11,200installs brainstorm-experiments-existing phuryn skill This skill helps plan experiments to validate assumptions about an existing product before committing to full builds. Use it to test hypotheses with prototypes, A/B tests, spikes, and other lean methods. Claude Code CX Codex Cursor +1 2,800installs appllama-app-design-skill Appllama (appllama.io) skill Skill for building native iOS and Android screens with Expo and React Native. Designs with Apple HIG fidelity, semantic colors, Reanimated motion, proper navigation semantics, and simulator-verified iteration. Claude Code CX Codex Cursor +1 4,700installs ai-image-generation 101-skills skill Generates and edits images through belt with selectable models. Use it for illustrations, mockups, and changes to existing images. Claude Code CX Codex Cursor +1 861,200installs scroll-experience sickn33 skill This skill guides an agent through scroll animations, parallax scenes, and interactive web narratives. Use it when scrolling should reveal part of a page’s story. Claude Code CX Codex Cursor +1 2,000installs vision-analysis MiniMax-AI skill Describes images, extracts text, and reviews UI mockups using the MiniMax vision MCP tool. Handy when an agent needs to understand a screenshot or design file. Claude Code CX Codex Cursor +1 2,700installs brand-extract nexu-io skill Extracts a complete brand kit from a live website via the in-app browser. Gathers semantic colors, fonts, logos, and generates brand.json. Claude Code CX Codex Cursor +1 1,100installs state-machine jakubkrehel skill Builds a throwaway page for every reachable state of one component, using mock data and a switcher. Use it when visual work needs isolated states without changing the component. Claude Code CX Codex Cursor +1 3,500installs build-design jakubkrehel skill Builds UI code from a Figma file or image mockup. It reuses existing project tokens and components instead of hardcoding values. Claude Code CX Codex Cursor +1 3,400installs infographics K-Dense-AI skill Turns your data into a PNG infographic through Nano Banana 2, then scores the result against a quality threshold. Handy when a report needs a picture instead of another table. Claude Code CX Codex Cursor +1 2,000installs generate-image K-Dense-AI skill Generates and edits images via OpenRouter Image API using Gemini, Recraft, and Seedream. Ideal for artwork, logos, concept art, and editing reference images. Claude Code CX Codex Cursor +1 2,000installs quick-mockups civitai skill Generates 3 to 5 parallel UI mockups in HTML. Useful when you need to explore layouts, wireframes, and hierarchy variations before writing frontend code. Claude Code CX Codex Cursor +1 1,700installs pretext Hermes Agent skill A skill for browser demos built on @chenglou/pretext: text wraps around shapes, splits into graphemes and gets measured through canvas without a page reflow. Claude Code CX Codex Cursor +1 317installs pretty-mermaid imxv skill Renders Mermaid diagrams to SVG, PNG, or ASCII/Unicode without a browser. Useful for docs, READMEs, and terminal output. Claude Code CX Codex Cursor +1 4,500installs appllama-usage Appllama (appllama.io) skill Guides Appllama MCP research for mobile apps: inspect real screens and flows before building or improving an interface. Claude Code CX Codex Cursor +1 4,000installs ads-photoshoot AgriciDaniel skill Generates rights-cleared paid-ad product photography from an authorized image and brand profile. Keeps packaging and logos intact across studio or lifestyle scenes. Claude Code CX Codex Cursor +1 3,800installs ads-generate AgriciDaniel skill Generates paid-ad image assets from a validated brief and brand profile using a configured image provider. Keeps generation audits with hashes and safe zones. Claude Code CX Codex Cursor +1 3,800installs library-curator nexu-io skill Pulls images, logos and screenshots out of the OD Library and copies the file into your project, handing back a relative path you can drop into markup. Claude Code CX Codex Cursor +1 951installs mobile-app-ui-design ceorkm skill Provides mobile UX and UI guidelines for coding agents. Helps generate mobile screens, components, and design flows that follow structured layout rules. Claude Code CX Codex Cursor +1 11,500installs html-diagram plannotator skill Generates standalone interactive HTML diagrams without external services or build steps. Helps visualize component topology, state transitions, timelines, and quantitative structures. Claude Code CX Codex Cursor +1 4,100installs