Videos

Anthropic Product Designer Meaghan Choi and Figma Developer Advocate Akbar Mirza show how Anthropic goes from design to prototype to production with Claude Code and Figma’s Dev Mode MCP server.

In response to Dann Petty, Dan Mall recorded a video showing what parts of Auto Layout he uses and what he ignores. I found it interesting because it’s so different than the way I use Auto Layout, but it works well for Dan! I use spacer frames occasionally, but never as my first choice.

Joey Banks shares a free lesson from his course with Dive readers on how to use Figma’s MCP Server. 

In this replay from the June 4th, 2025 webinar, learn more about the latest tools that help you express more in your Figma designs. Lauren Budorick, Rogie King, and Tim Van Damme will walk through improvements to vector editing, as well as new brushes, fills, and effects.

Figma rings the opening bell at the New York Stock Exchange on July 31st.

Miggi and special guests walk through updates across Figma Make, Sites, Buzz, FigJam, Slides, Dev Mode, Draw, and Design. Highlights include style context and Supabase integration in Make, vector simplifying and offset in Draw, grid updates, Dev Mode’s interactive inspection, and Sites’ background video fill.

Jack Michalak and Tammy Taabassum pair with Supabase​’s Chris Caruso to demo Make’s new Supabase connector, wiring auth, file uploads, and live Postgres tables straight from a Figma frame. Nice primer on turning a design into a data-backed web app with almost no code.

Tailwind’s Dan Hollick shows Ridd from Dive Club how Claude Code ties into Figma’s MCP server to spin up an editable UI, sharing his prompting tactics and live-debug workflow along the way. Handy if you’re testing AI-assisted builds from real design files.

Figma’s newest product designer Rogie presents a new effect that allows you to manipulate light, depth, frost, and refraction to create dynamic elements that refract light like physical glass. This playground file will teach you how to use the effect and provide creative inspiration to have fun with glass. 

This effect looks incredible! So glad we won’t need to deal with hacky imitations. Don’t miss a breakdown of how Miggi made this video.

Grid improvements, offering more precision and control: delete rows and columns, set min and max, and adjust multiple grids with a faster grid picker. The Grid Playground community file was also updated with new features.

Sergei Chyrkov recorded a tutorial on imitating the Liquid Glass effect on a button in Figma.

Theo explains why Figma is going public, why now, and what risks they’re facing.

Designer Advocate Lauren breaks down how to create code layers in Figma Sites.

Now you can bring an existing design library to Figma Make, so the model can extract color palette and usage guidelines, typography and custom fonts, as well as core styling elements. You can also manually define rules for the model to follow via a guide​line​.md file. Watch the above video from Make PM Holly Li, or read the help article.

You can now adjust the width of your stroke at any given point along a path with the new variable width stroke vector editing tool. Variable width stroke also makes it possible for users to draw with pressure sensitivity on tablets. Figma will set the stroke width to reflect the amount of pressure applied at each point when drawing with a stylus, which makes freehand drawing in Figma more realistic. (Still no iPad app though.)

Developer Advocate Akbar Mirza and Product Manager Yarden Katz provide a live update on Figma’s Dev Mode MCP (Model Context Protocol) server, explaining what MCP is, how it works, how to set it up, and how it helps bridge the gap between design and code. They also cover the new support for Annotations, which allows designers to add accessibility, behavior, and content information to their design files, which the AI agent can then use to generate more accurate code. Finally, they discuss the importance of aligning variable names between design and code. Don’t miss the follow-up video where Akbar and Yarden answer viewer questions from the livestream. 

In this interview, Jay chats with Ian Guisard who leads design systems for Uber. You will learn how Ian adds new components to the design system, applies variables to reduce component size, deprecates existing components, specs components for developer handoff, handles design system rule breakers, and more.

Developer Advocate Jake Albaugh shows how to bring design context from Figma directly to your agentic coding tools with the new Dev Mode MCP server.

Great demo of code layers by Niko, who is now a product manager for interactivity. ​“Code now belongs; make a mess, rev, refine.”