Product Thumbnail

Theme Buddy Figma Plugin

Export and import theme settings from Figma to code

Design Tools
Developer Tools

Theme Buddy is a Figma plugin that simplifies theme management in your Ant Design projects. Export Figma themes as JSON files to easily match with your code or import theme settings from your code into Figma.

Top comment

Hey everyone! 👋 I'm excited to announce our new resource - Theme Buddy for Ant Design - Figma plugin. It's our another great addition to our Ant Design System for Figma resources ecosystem to help you deliver your Ant Design projects faster. When choosing a design system for Figma, it’s essential to consider how it can minimize repetitive tasks for both designers and developers during coding. Transferring styles from Figma to code can be time-consuming, with developers often missing details on component colors, radii, or sizes. The complexity increases when designers make changes post-implementation, requiring extensive communication with developers. This added workload can be frustrating and inefficient. Our team previously faced these challenges, leading to wasted client resources on repetitive tasks. Nowadays, we rely on our Figma plugin - Theme Buddy for Ant Design, which enables us to transfer styles from the Ant Design System in Figma to our code projects instantly. This tool eliminates communication gaps and manual updates. By simply opening the Theme Buddy plugin, a JSON file with all variables for light and dark modes is generated, which developers can quickly integrate into their React projects, restyling the code within seconds. This enhancement significantly boosts collaboration between design and development, allowing us to focus on more critical aspects of the project. Unlike many UI kits, our plugin in combination with Ant Design System for Figma prevents designers and developers from dealing with repetitive and tedious tasks. Export feature The export tab lets you copy or save the Ant Design System for Figma theme settings as JSON. It takes the data from Figma variables and converts it to a JSON format that developers can use to modify the ConfigProvider component so the code version of the project will look exactly the same as the Figma version. Import feature The import tab lets you transfer theme settings from your code into Figma, ensuring consistent styling between your Ant Design React app and Figma designs. For example, if you already have styling applied to your React app, you can copy the ConfigProvider theme settings and paste them into the plugin import tab. The plugin will then apply changes to variables. Learn more about Theme Buddy on our website: https://www.antforfigma.com/them...

Comment highlights

It will indeed make our work easier. Does the company have any plans to back more UI kits in the future?

I like the concept of this startup because it facilitates the seamless transfer of design elements and settings from Figma to code, streamlining the process of web development. This innovative idea has the potential to significantly improve workflow efficiency and collaboration between designers and developers. The implementation of exporting and importing theme settings from Figma to code enhances productivity and ensures design consistency across different platforms. Overall, I believe this startup has great potential to positively impact the design and development industry.

hugeee! 🚀 Theme Buddy makes handling themes in Ant Design projects a breeze! Will definitely give it a try

Love Theme Buddy! Is a tool that helps you to use the Awesome Art Designs quickly and easily share objects and themes between projects. Very useful! Thanks for this tool!

I like seeing products that are getting us closer and closer to full figma to code exports. This looks like it will solve a piece of that puzzle. Should be a great time saver.

congrats on the launch of theme buddy. the feature to export and import theme settings seems genuinely useful for maintaining consistency. how has integrating this plugin impacted the workflow speed in real-world projects? which feedback from early users was most surprising or enlightifying?

Awesome launch! The export and import features are exactly what we need to bridge the gap between design and development. This plugin will definitely streamline our projects. Fantastic work!

Recently I have got acquainted with themes and I realized that it is a cool thing)