Figbruary. Boost resolution. Anima and v0.
Sponsor
illustrator.to.design
Import your Adobe Illustrator files as fully editable Figma designs. Fast, high-quality conversion of your .ai artboards into Figma layers!
Release Notes
Gradient Variables Binding in DevMode
Dev Mode users can now see variables used in gradients. Binding variables to gradients was also added to the plugin API so plugin developers can offer variables support out-of-the-box.
New additions to Figma AI (beta)
Two new AI features — quickly search through top Community files to find assets you need and increase the resolution and clarity of your images in just one click in the editor.
What’s New in the Figma Forum
Figma Community Forum got a big makeover in January. It’s a great place to ask questions or share your thoughts.
What’s New
Figbruary
It’s time to sharpen your Figma skills! Figbruary is an entire month of Figma challenges organized by Vijay Verma. Every day, a new prompt from someone in the Figma community involves designing a UI, drawing an illustration, making a prototype, or creating an animation. Make something fun, share your work, and tag it with #figbruary or #figbruary2025.
Photoshop unlocks creative collaboration with Live Co-Editing
Adobe brings multiplayer to Photoshop desktop and web apps. Now, multiple creators can simultaneously access and edit documents from different computers. It’s about time!
Using Figma
Working with Figma and custom design systems in v0
Vercel shares best practices on importing your designs from Figma to v0 and working with shadcn/ui. I was excited about this integration until I realized it simply exports the Figma frame as an image and passes it to v0’s AI vision. Information about Auto Layout, spacing, color tokens, and typography is not preserved from Figma but inferred from the image. That’s fine for rough prototypes, but there is a better way.
Transform Figma designs into shadcn components with Anima
Anima has been working on design-to-code tools since before the recent AI craze. A few months ago, they added support for shadcn/ui components, which I tried last week on my current project designed with this library.
Unlike v0, they parse the Figma file and get a lot of details right. I was impressed with how accurately it selected shadcn/ui components, even if layers weren’t explicitly named or instances were detached in the mockup. It becomes obvious that parsing a file is the right approach when different components look the same on the surface. For example, the trigger for opening a dropdown or date picker uses the same button, but they are different Figma components under the hood, and Anima chose their counterparts in code correctly.
Exporting custom colors and typography variables to a Tailwind config is also a nice touch. I ran into a few issues with excessive Tailwind styling and newer shadcn/ui components like the Sidebar not being recognized, but overall, this clearly feels like the right direction.
Pixelized app icon
You can always rely on Vijay to come up with the most creative ways to achieve special effects.
Resources
Stunning gradients
Nice to see stunning gradients made from scratch. The Figma file is now available for download.