MCP, Model Context Protocol, är en öppen standard som låter AI-agenter ansluta till datakällor och verktyg. För designers betyder det att ett AI-kodningsverktyg kan läsa en designfil direkt istället för att gissa från en skärmdump och i vissa fall skapa eller ändra själva designen.
Figma har en MCP-server som ger AI-agenter designkontext, såsom variabler, komponenter och layout, så att de kan generera kod från utvalda ramar. Det kan också skriva inbyggt Figma-innehåll tillbaka till arbetsytan; Figma beskriver den funktionen som gratis under sin beta och planerad att bli användningsbaserad. Enligt Figma:s hjälpcenter är MCP-servern tillgänglig för Starter-, Professional-, Education-, Organisations-, Government- och Enterprise-planer.
Penpot har en gratis och öppen MCP-server. Penpot beskriver det som att det fungerar med alla MCP-klienter och -modeller, inklusive Claude, Cursor, Visual Studio Code och OpenAI Codex, och team kan distribuera det på sina egna servrar för att hålla designdata privat.
ExodeUI, som vi gör, har en MCP-server för interaktivt användargränssnitt och animering. Claude Code, Cursor och andra AI-kodningsverktyg kan skapa och redigera animationer, inklusive tillstånd, fjäderfysik, inmatningar och händelser, från klarspråkiga uppmaningar. Resultatet är en öppen .exode-fil som körtidspaket spelas upp i React, Vue, Svelte, Angular, Solid, React Native, SwiftUI och Flutter.
Andra verktyg lägger till MCP-stöd snabbt, så kontrollera varje leverantörs dokument innan du väljer. Icons8, till exempel, erbjuder en MCP-server för sitt ikon- och illustrationsbibliotek, vilket är användbart tillsammans med sin Lunacy-designapp men inte redigerar Lunacy-filer.