Figma introduced a suite of new design and coding features at its annual Config conference, including AI-generated motion graphics effects and shader tools that let creatives animate projects by describing them in natural language. The updates aim to automate repetitive tasks while keeping users inside the Figma Design canvas.

AI-Powered Animation and Effects

The centerpiece of the announcement is Figma Motion, a feature that generates animations and transition effects through a chatbot interface. Users can describe an effect such as "fade in from left" or "bounce on click" and the system produces corresponding motion graphics without manual keyframing. Figma also added shader tools that allow designers to apply real-time visual effects like gradients, glows and distortions directly within the canvas.

  • Motion graphics: Generate animations by typing descriptions into Figma's chatbot interface
  • Shader tools: Apply real-time visual effects such as gradients, glows and distortions

Coding Layers for Full-Stack Development

Figma also revealed coding layers that let developers tweak project code without leaving the design environment. This feature integrates with existing workflows so teams can edit CSS, JavaScript or other front-end code alongside visual elements. The company described the updated canvas as optimized for full-stack development, bringing teams, AI agents, tools and materials together in one place.

Why This Matters

The updates directly affect product designers, front-end developers and creative teams who rely on Figma Design for prototyping and handoff. By embedding AI-driven animation generation into the core tool, Figma reduces the need for separate motion design software or manual scripting. For developers, coding layers eliminate context switching between design files and code editors. The broader implication is a tighter integration between design and development workflows which could accelerate product iteration cycles across tech companies.

Industry Context

The move reflects a wider trend among design tool makers to embed generative AI capabilities directly into creation environments rather than offering them as standalone plugins. Adobe has pursued similar strategies with Firefly integration in Photoshop while Canva has expanded its AI-powered video editing features. Figma's approach focuses on keeping users inside its ecosystem by reducing friction between ideation, animation and deployment.