A recording of office hours from May, where the Figma team walks through different layouts where the grid can be used to create rich and responsive UIs.
“We’re introducing a series of new features that remove barriers for keyboard-only designers across most Figma products. Users can now pan the canvas, insert objects, and make precise selections quickly and easily. And, with improved screen reader support, these actions are read aloud as users work, making it easier to stay oriented.”
“If a variable or style name gets cut off in the picker, you can now hover over it to see the full name.”
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.
The new Variables modal got search and filter capabilities and now opens edge-to-edge for better visibility.
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.
Socrates vibe-coded a plugin that parses Tailwind CSS variables from tweakcn and imports them into Figma. No hassle, no aliasing — just variables named aligned with code.
“Organization admins at companies using Governance+ for Figma Enterprise can now prevent users with view-only access from copying, saving, or exporting files. These controls can be applied to guest viewers or to all viewers, and can be configured at the organization or workspace level to align with your data-sharing policies.”
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.
My sympathy goes out to web developers looking for Glass’s CSS in Dev Mode.
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.
I purchased Emil Kowalski’s course on animation back in April, but started working through it only last week. Emil is a design engineer at Linear and previously worked at Vercel. The course is fairly technical and requires an understanding of CSS, JS, and React, but it does a really good job introducing Motion and explaining what separates good animations from great. It’s been very helpful as I’m working on a new personal website, so definitely recommend checking it out!
Tired of liquid glass yet? Sebastiano Guerriero shares a step-by-step process of creating a different type of colored glass buttons.
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.
Brett from DesignJoy breaks down the process of creating animated mockups using Midjourney and Figma.
Copy image adjustments from one image to another. Just select an image on the canvas, click Copy, select another image, and paste the image adjustments there.
Customizable glass effect generator supporting background blur, color tints, and textures with export to CSS.
Sergei Chyrkov recorded a tutorial on imitating the Liquid Glass effect on a button in Figma.
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 guideline.md file. Watch the above video from Make PM Holly Li, or read the help article.