Design & Media Agent Skills for Windsurf (legacy)

Common patterns for building store locators, restaurant finders, and location-based search applications with Mapbox.

Generate beautiful, on-brand HTML artifacts — reports, diagrams, diff reviews, slide decks, plans, recaps, dashboards.

Generates professional 3D-style iPhone and MacBook showcases using pure CSS and HTML to display live UI content.

Automate Abstract tasks via Rube MCP (Composio).

Apply production-ready patterns for Adobe Firefly Services SDK, PDF

Design AI-first interfaces that build ongoing relationships through memory, trust evolution, and collaborative planning, not just isolated…

Builds AI chat interfaces and conversational UI with streaming responses, context management, and multi-modal support.

Generate AI images using Gemini or GPT APIs directly.

JLCPCB PCB fabrication and assembly — BOM/CPL generation, basic vs extended parts, assembly constraints, design rules, ordering workflow.

UI design system toolkit for Senior UI Designer including design token generation, component documentation, responsive design…

Framer Motion patterns, page transitions, skeleton loading, scroll-linked animations, and gesture-based interactions for React.

Generate TAAG/FIGlet-style ASCII art banners using figlet.js (FIGfont spec), with layout controls (horizontal/vertical layout, width…

Render structured data as aligned ASCII tables (column width rules, truncate/wrap, border styles, compact/readable variants) for…

Zero-config animations for React, Vue, Solid, Svelte, Preact with @formkit/auto-animate (3.28kb).

Dry-run, upload, and cautiously initiate local Bambu Lab print jobs from validated plain `.gcode`, using Bambu LAN FTPS/MQTT handoffs.

Automate Canva tasks via Rube MCP (Composio): designs, exports, folders, brand templates, autofill.

Execute the Canva design creation and export pipeline via the Connect

Reference route shells for the ACEAnalytics nextjs-fdas app — marketing pages, product detail routes (forecasting, peer-analysis), root…

Pick cinematic keys, ratios, and grade strategies.

UX design methodology and external consultation.

Use this plugin when the user wants a high-end, dark cinematic hero section for a coding-education / bootcamp landing page (CodeNest)…