Figma integrerar GitHub i designytan. Cursor satsar på det omvända

Code Layers, Figmas nya funktion, gör något som för två år sedan hade verkat otänkbart: det låter dig klona ett GitHub-repository direkt onto designytan. Väl på plats kan du extrahera redigerbara designramar från den befintliga koden, göra visuella ändringar och synkronisera dem tillbaka till repositoryt — allt i en enda Figma-fil, med samarbetet i realtid intakt. Design och utveckling i samma fönster.

För designers som i åratal skrivit överlämningsnoter, kopierat specifikationer till Jira-ärenden eller skickat Zeplin-länkar till ingenjörsteamet förändrar Code Layers var samtalet mellan design och kod äger rum. Ändringar i Figma uppdaterar den underliggande koden; ändringar i koden uppdaterar designlagret. Bryggan mellan de två disciplinerna har alltid krävt ett kontextbyte — nu minskar det bytet.

Figma Motion förvandlar animationer till leveransklart kod

Figma presenterade också Motion, en keyframe-baserad animationstidslinje direkt inbyggd i ytan. Designers kan skapa övergångar, hoverstatus och scrollanimationer med en tidslinje och ett bibliotek med förinställningar, och sedan exportera dem i sju format: CSS, JSON, React, MP4, WebM, animerad SVG och GIF. En laddningsanimation skapad i Figma är inte längre ett referensdokument som en utvecklare måste tolka — det är animationen i sig.

Den tredje stora nyheten var Shader Effects, GPU-accelererade fyllningar drivna av WebGPU — webbläsarens nyaste grafikstandard — som låter designers applicera komplexa, matematiskt genererade visuella texturer direkt på Figma-lager. Figmas AI-agent kan generera dessa anpassade shaderfyllningar från en textbeskrivning eller en uppladdad bild. Skriver man en fras som ’matterat glas med mjuka blå interferensmönster’ producerar ytan något som renderas direkt och kan justeras interaktivt.

AI-agenten utökas med färdigheter, verktyg och externa kopplingar

AI-agenten i sig har utvidgats avsevärt. Den kan nu bygga återanvändbara ’färdigheter’ från instruktioner i naturligt språk — anpassade verktyg som automatiserar repetitiva designuppgifter utan att kräva API-kunskaper — och ansluter direkt till externa tjänster inklusive Notion, GitHub och Microsoft Excel. En kommande uppdatering under 2026 lägger till Weavy, en workflow-byggare som Figma förvärvade förra året, för nodbaserad automatisering inuti designfiler.

Allt är inte tillgängligt idag. Code Layers är i tidig åtkomst, med ansökningar som öppnar i juli 2026; det kräver en Full-plats på en betald Figma-plan. Shader Effects och den förbättrade AI-agenten är aktiva på betalda planer. Figma Motion är tillgängligt nu för innehavare av Full-plats, med allmän tillgänglighet för Code Layers förväntad senare under 2026.

Figmas ambition att absorbera delar av kodredigerarens arbetsflöde stöter på en konkret fråga: att skriva kod och att designa gränssnitt är olika kognitiva aktiviteter, och Cursor — kodredigeraren med AI som SpaceX förvärvade för 60 miljarder dollar förra veckan — har byggt sin publik bland ingenjörer, inte designers. Om de två gemenskaperna kommer att mötas kring en gemensam yta är fortfarande en öppen fråga.

Taggar: GitHub, Code Layers, Config 2026, Cursor, designverktyg, Figma