AIToday

Figma adds AI-powered motion graphics, shader effects, and code editing tools to help designers and developers work faster together.

The Verge AI2h ago5 min read
Figma adds AI-powered motion graphics, shader effects, and code editing tools to help designers and developers work faster together.

Key takeaway

Figma has unveiled AI-powered design and coding tools at its annual Config conference, including the ability to generate animations and shader effects through natural language prompts and to edit code directly within the design canvas. The updates are meant to help creative teams automate repetitive tasks and collaborate more seamlessly. A full integration with Figma Weave, an AI workflow tool, is planned for later in the year.

Summaries like this, in your inbox every morning.

Sign up free →

3 Key Points

  • What happened

    Figma announced new product features at its Config conference, including code layers that let users edit code directly on the design canvas, AI-generated motion graphics and transition effects created by describing them to a chatbot, and shader effects built by prompting the tool. The company also introduced Figma Weave workflows with 20 plus integrated tools, and generative plugins that let teams build custom, reusable tools without requiring developer setup or technical skills.

  • Why it matters

    These updates aim to reduce tedious, repetitive work for design and development teams by letting them automate tasks with AI and collaborate in a single place. Code layers and motion tools connected to design systems could streamline the handoff between designers and developers, potentially reducing back-and-forth cycles. The ability to turn repetitive work into reusable team skills suggests Figma is positioning itself as a full-stack tool for both design and coding.

  • What to watch

    A full integration between Figma and Figma Weave is expected later this year, which would deepen the AI capabilities available directly on the canvas.

FAQ

What new AI capabilities did Figma announce?
Figma introduced AI-generated motion graphics that create animations and transitions by describing them to a chatbot, shader effects that let users build custom visual treatments like dither and pixelate, and agent skills that turn repetitive work into reusable tools for entire teams.
Can developers edit code without leaving Figma?
Yes. Code layers allow you to work directly with code on the Figma Design canvas—you can clone repositories, extract flows into editable design layers, and sync changes back to code, all without leaving the canvas.
Do teams need technical skills to build custom plugins?
No. Generative plugins let teams build custom, reusable tools with the agent and turn prompts into tools that can be tweaked and shared with no developer setup or technical skills required.

Discussion

No comments yet. Be the first to share your thoughts!

Log in to join the discussion

Related Articles

Stay ahead with AI news

Get curated AI news from 200+ sources delivered daily to your inbox. Free to use.

Get Started Free

Free · takes 30 seconds · unsubscribe anytime

5 minutes a day. The AI essentials.

200+ sources · Email / LINE / Slack

Get it free →