You can now type directly in the hex code input to access your color variables and styles. Lots of smart details: enter a hex value and see all variables and styles using it, colors are surfaced based on the context, and related terms are baked into the new algorithm (i.e., finding your ​“danger” variable when searching for ​“error”).

Joey Banks: “…trying Figma Console MCP has completely opened my eyes into what I can offload. Not because it replaces the enjoyable work that I was doing before, but because it handled some of the longer, more repetitive tasks so quickly, and actually so well. Creating 200+ variables took seconds, and mapping them to color swatch instances so the team could preview values was way easier than I expected.”

“Bringing Claude Code workflows directly into Figma lets developers, designers, and even hobbyists capture a real, functioning UI from a browser — in production, staging, or localhost — and convert it into editable frames on the Figma canvas. Code is powerful for converging — running a build, clicking a path, and arriving at one state at a time. The canvas is powerful for diverging — laying out the full experience, seeing the branches, and shaping direction collectively. Going from code to canvas helps teams move fluidly, so work can narrow when it needs to and open up when it’s time to collaborate.”

My guess is it’s based on the html.to.design technology that Figma acquired last year, which is a huge time saver and an essential part of my toolkit. I haven’t tested Claude Code to Figma yet, but the result in demos looks very similar to what I usually get from the plugin. Which makes me wonder why they limited it to Claude Code instead of making something like a universal ​“Send to Figma” browser extension?

New device frames are now available for the latest iPhone 17 and Air models.

“Join Nikolas Klein (Product Manager, Figma) and Peter Ng (Product Designer, Figma) in the first episode of Design Roulette, where we challenge designers to create designs with no preparation. The twist? They’ll also have to spin the wheel and incorporate the chosen random design prompt into their design. In this episode, they’ll conceptualize ads for the mythical hot sauce, Véloce, using Figma’s new AI image editing tools.”

The Glass effect is now generally available, and Miggi introduces a few updates: add Glass to any object, shape, or text; design Glass with non-uniform corners and precisely round each corner radius; use the Splay property to control how light bends around an object’s edges; and apply variables to Glass properties to easily connect to your design system.

Big update to Figma navigation! The rollout seems to still be in progress, as I’m seeing it only in one of my accounts. If you aren’t seeing it yet, here is another quick demo from Zander.

“We’re introducing a new left navigation bar in Figma Design, Draw, and Dev Mode to make it easier to move between library assets, variables, and search. To help you get familiar, we added labels, which you can toggle anytime in the View menu. Edge-to-edge variables authoring experience. See everything at a glance with the new full screen view that spans the entire width of the browser.”

Ana Boyer designs a web homepage, showcasing recently launched Figma Design and Draw features. ​“Learn how to create a text-inlay parallax hero using Remove background and Isolate object, apply Glass effects, expand an image within a grid, generate illustrations via AI prompts, and add Draw texture effects.”

Christine Vallaure walks readers through her Figma workflow — how she combines everything, thinks through a project, and turns all those features into a working and maintainable file.

Nikolas Klein, PM at Figma: ​“Now you can copy any design from a Figma Make preview to the design canvas, allowing you to edit, iterate, and take your ideas further.” To make this possible, Figma purchased the technology behind a popular html.to.design plugin from my friends at <div>RIOTS. As part of this partnership, they will keep building and maintaining their plugins and tools independently, including html.to.design.

In this livestream, James McDonald iterates on Ridd’s design for Inflight and talks through design decisions in real time. Nice peek at how product polish actually happens.

Tom Johnson suggests we need to go from Canvas → Make to Make → Canvas → Make, so we could prompt the rough parts of the app and then use those scrappy elements to design all of the different canvases for the flow or feature, then feed those back into the Make workflow.

A new official free course for beginners: ​“This course will walk you through the entire process of creating a website design for a personal portfolio website. We’ll start by teaching you the fundamental concepts and features that Figma Design offers, and then we’ll go on a creative journey together to make a website that you can customize to make your own using some of Figma’s most exciting features.”

Figma created an entire hands-on course on designing a portfolio website from scratch. ​“We’ll cover the basics like shapes, text, and frames, and tap into more advanced features like auto layout, components, and prototyping. By the end, you’ll be ready to start bringing your own ideas to life.”