Hey! 👋 Matt here from antforfigma.com.

I'm writing to inform you that after hundreds of hours of work and collaboration with developers, version 3.0 of Ant Design System for Figma is now available with new cool features!

👀 Preview the new version in Figma

📼 View video overview of new features

What's new?

Figma Tokens Sync

Figma Tokens Sync is an additional and premium feature we built on top of the Figma Tokens plugin that will allow you to sync your tokens with your Ant Design of React project repository on GitHub. For example, you can change the primary color or font family in your Figma file and sync your changes with your code project, which will reflect those changes.

How does it work?

It creates .less files based on your token's JSON file in Figma Tokens, so you can easily sync your token changes in Figma with your .less files in Ant Design of React code.

How to get it?

You can purchase it with the newest version of Ant Design System for Figma 3.0 below:

View pricing

Improved components Inspect panel

Each component and icon now has a React code sample and a link to documentation in the Inspect panel in Figma. Developers can copy the sample code of the component directly from Figma or go to the Ant Design documentation by clicking on the View documentation button.

Redesigned documentation

I've decided to move the documentation of the components from one page to separate pages. Each component has a dedicated page with the main components and documentation. It also lowered the file size, making it quicker to work with on slower machines.

Slot, Space, and Grid components

I've added new components to help you build your layouts without detaching components. Space and Grid components also have the sample code in the Inspect panel that developers can use in their React implementation.

Figma Tokens features

Version 3.0 also takes full advantage of the Figma Tokens plugin, which will allow you to:

change the style of the entire UI kit in a few minutes
switch from a light to a dark theme
edit components' tokens

New website

I've redesigned the entire antforfigma.com website to introduce the new Ant Design System for Figma 3.0 features and added documentation to guide you on how to use the latest version of the UI kit.

FAQ

I already bought Ant Design System for Figma how to get a new version?

Every time we release a new update, we upload the new files to Gumroad, and you can access the new files by your Receipt, Email, or Gumroad library. Learn more here

Do I need Figma Tokens Sync to sync my Figma file with my Ant Design of React project?

Yes, a Figma Tokens Sync subscription is required to be able to sync your Ant Design System for Figma with your Ant Design of React code repository.

Do I need Figma Tokens Pro to have Figma Tokens Sync work?

No, you don't need Figma Tokens Pro. It works on a free version of the plugin.

Is the Figma Tokens Sync feature available for older versions of the Ant Design System for Figma?

No, the Figma Tokens Sync feature works only for Ant Design System for Figma version 3.0 (and above).

New update - Ant Design System for Figma 2.5 🚀

GuidesLab is now available on the Figma Community 🚀

Learn and teach Figma in Figma (my new plugin) 👨‍💻

Ant Design System for Figma 2.3 - New hot update! 🔥🔥🔥

I'm a speaker at No Code Conf 2021! Streaming tomorrow (Thursday)!

See all posts from Matt Wierzbicki