Legacy Circuit Mockups
GitHubOfficial
Generate visual breadboard circuit mockups and diagrams for retro electronics and computing projects using HTML5 Canvas.
Trusted skills for AI agents from official vendors and established maintainers. Every skill is attributed to its author, scanned, and comes with install steps for your AI tool.
209 skills
GitHubOfficial
Generate visual breadboard circuit mockups and diagrams for retro electronics and computing projects using HTML5 Canvas.
GitHubOfficial
Generate and edit images using the Gemini 3 Pro Image model via OpenRouter.
GitHubOfficial
Integrate ImageMagick for cross-platform image processing, resizing, and metadata extraction.
GitHubOfficial
Generate AI-powered visual assets using OpenAI or Google Gemini models.
GitHubOfficial
A comprehensive guide for executing professional UI/UX design workflows in Penpot using MCP tools.
GitHubOfficial
Generates UX research artifacts, journey maps, and design specifications to inform UI development in Figma.
GitHubOfficial
A specialized UI/UX design agent focused on creating professional, accessible, and cohesive design systems and layouts.
GitHubOfficial
Expert technical artist for Adobe Creative Cloud, specializing in automation, integration, and cross-app workflows.
GitHubOfficial
Generate structured Excalidraw diagram files from natural language descriptions.
GitHubOfficial
Generate and edit draw.io diagram files using structured mxGraph XML.
GitHubOfficial
A guide and toolkit for creating annotated animated GIF demos for documentation and pull requests.
GitHubOfficial
Create, edit, and embed stylized dotted world maps and animated 3D globes using Globestudio.
AnthropicOfficial
Provides structured, multi-dimensional design feedback on usability, visual hierarchy, consistency, and accessibility.
AnthropicOfficial
Perform a comprehensive WCAG 2.1 AA accessibility audit on web pages or design files.
AnthropicOfficial
A comprehensive toolkit for auditing, documenting, and extending design systems to ensure consistency and scalability.
AnthropicOfficial
Generate and refine user interface copy including microcopy, error messages, and CTAs.
OpenAIOfficial
Generates and edits raster images for project assets using built-in tools or an optional CLI fallback.
OpenAIOfficial
Connects Figma design components to code components using Code Connect mapping tools. Use when user says "code connect", "connect this component to code", "map this component", "link component to code", "create code connect mapping", or wants to establish mappings between Figma designs and code implementations. For canvas writes via `use_figma`, use `figma-use`.
OpenAIOfficial
Use 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.
OpenAIOfficial
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 guidelines", or wants to establish project-specific conventions for Figma-to-code workflows. Requires Figma MCP server connection.
OpenAIOfficial
**MANDATORY prerequisite** — you MUST invoke this skill BEFORE every `use_figma` tool call. NEVER call `use_figma` directly without loading this skill first. Skipping it causes common, hard-to-debug failures. Trigger whenever the user wants to perform a write action or a unique read action that requires JavaScript execution in the Figma file context — e.g. create/edit/delete nodes, set up variables or tokens, build components and variants, modify auto-layout or fills, bind variables to properties, or inspect file structure programmatically.
OpenAIOfficial
Use this skill alongside figma-use when the task involves translating an application page, view, or multi-section layout into Figma. Triggers: 'write to Figma', 'create in Figma from code', 'push page to Figma', 'take this app/page and build it in Figma', 'create a screen', 'build a landing page in Figma', 'update the Figma screen to match code'. This is the preferred workflow skill whenever the user wants to build or update a full page, screen, or view in Figma from code or a description. Discovers design system components, variables, and styles via search_design_system, imports them, and assembles screens incrementally section-by-section using design system tokens instead of hardcoded values.
OpenAIOfficial
Build or update a professional-grade design system in Figma from a codebase. Use when the user wants to create variables/tokens, build component libraries, set up theming (light/dark modes), document foundations, or reconcile gaps between code and Figma. This skill teaches WHAT to build and in WHAT ORDER — it complements the `figma-use` skill which teaches HOW to call the Plugin API. Both skills should be loaded together.
OpenAIOfficial
Create a new blank Figma file. Use when the user wants to create a new Figma design or FigJam file, or when you need a new file before calling use_figma. Handles plan resolution via whoami if needed. Usage — /figma-create-new-file [editorType] [fileName] (e.g. /figma-create-new-file figjam My Whiteboard)