When you visit websites, they may store or retrieve data in your browser. This storage is often necessary for the basic functionality of the website. The storage may be used for marketing, analytics, and personalization of the site, such as storing your preferences. Privacy is important to us, so you have the option of disabling certain types of storage that may not be necessary for the basic functioning of the website. Blocking categories may impact your experience on the website.
Ant Design System for Figma (based on Ant Design 5.7+)
Design and develop Ant Design projects
faster than ever
The powerful UI kit for
Figma
based on the most popular React UI library -
Ant Design
. Create and implement well-documented Ant Design apps in no time!
check
Variables
, Auto Layout, Variants, Component Properties
check
Built with
Figma Tokens
that you can
sync with your code
Variables in Ant Design System for Figma help save time and effort when building designs, managing your design system, and creating complex prototyping flows.
Making design work easier since 2019
Trusted by over
5,300+
designers, developers, and teams
From freelance designers to enterprise teams, Ant Design System for Figma is making the design process easier for design pros worldwide.
On my latest project,
Ant Design System for Figma saved our product team with five designers days—if not weeks—of work
. Of course it matches Ant Design well. The file is so well set up, I could feel the love put into it. It takes advantage of the best and latest Figma features.
Matyas
Co-founder at JustRocket
I've stumbled across AntDesign during a react UI framework research & was amazed of figma as a cross-platform collaborative design tool from the beginning.
Finding antforfigma was really the cherry on the top / love at first sight, since it has been marvelously speeding up our processes from design through development.
We recommend this UI kit to each of our partner.
Greg Dlubacz
Lead designer at Catenda AS
This is an absolute time-saver. The entire product is prepared with utmost attention to detail,
everything is well organized and easy to use even for inexperienced designers and developers who are not very familiar with design software
. It helps to save hundreds of hours, so you can forget about recreating the same UI components in every single project over and over again.
Chris Carter
Freelance Product Designer
The Ant Design System for Figma has helped me deliver concepts and projects faster.
Software Engineers that I have partnered with on projects that utilize the Ant Design System are amazed that my comps are just like their code
. This creates a powerful relationship. This kit gives you the power you need, ability to design faster, add customization that you need, and bring ideas to life. It’s definitely worth the price.
Miriam Isaac
UX Designer
The Ant Design System for Figma is an invaluable resource for any UX Designer who is tasked with planning and building out a DS for their org or client. Each component is constructed with care and precision. Matt constructs each component with auto-layout, and it makes this kit incredibly robust and flexible.
It will supercharge your work-flow and save you time, so you can focus on solving those complex UX problems!
Dawid
UX Designer at Allegro.pl
We have been looking for a suitable Design System for a long time for our Back Office tools. We have tested a lot, but in our opinion "ANT" is the most suited to our needs.
Its main advantages are the number of components, constant development and a very nice structure of variants
. It’s a really cool library.
Elizabeth Lin
Design Educator at Lambda School
We use the Ant Design System at Lambda School and love it!
It’s a great resource for both our engineering and design students. For non-designers, Ant Design makes it easy to sketch mockups quickly with basic Figma skills! For our design students, we use Ant as a way to introduce them to design components!
Many students will use and remix it in their first project. Components are so difficult to learn, but Ant makes it easy to understand how to structure a complex component library.
Mohit Hingorani
Product Designer
This UI Kit has saved me WEEKS of time! I use ant design framework to design & develop data tools for work, and this library has been a complete game changer for my team.
It has helped cut down design time while improving the quality of our work. Mateusz has created this library meticulously and it behaves exactly like you expect it.
I would highly recommend this to anyone creating complex data products.
Greg Rog
Founder at eduweb.pl
Matt, thanks for Ant Design System for Figma - we love it.
We are using the UI kit for our projects and it saved us hundreds of hours of repetetive work. It's also very easy to customize.
Great organisation and high quality components make it one the best Figma resources I've ever worked with.
Theo
Digital Creator
Matt has done an incredible job of capturing the essence of Ant Design within the Figma ecosystem.
The design system takes full advantage of Figma’s capabilities, and is by far the most flexible Figma library I’ve worked with.
Ant Design itself is inherently flexible, simple, and powerful, and this project accentuates that beautifully.
Maciej Korsan
Front-end Developer at EYEDEA
Want to save time and create things way faster? Use the combination of Ant Design and #antforfigma created by Matt.
Making new layouts has never been so easy!
Daniel
UI/UX Designer
I genuinely love Ant Design System.
It is simply the best resource I have ever used, it saved me so much time, I learnt things about Figma from it - I'll be using it for every project.
I wish I was a better writer because this deserves a standing ovation. It's a must have for any figma user who likes to get things done.
Blake
Digital Creator
Your Ant Design components for Figma were a lifesaver.
As someone that had never had to touch UI/UX before, I was able to build out and prototype a new app without any existing design experience.
I really appreciate the work that has gone into making these!
Ant Design System for Figma is perfect for creating internal tools or client work. Companies like Meta, Zalando, Allegro or eBay already saved hundreds of hours on their UI design.
Design and implement faster
Pixel-perfect components your designers & devs will love
The UI kit is fully packed with the best features to make work easier for designers and developers working on Ant Design projects.
widgets
Top-quality Ant Design components for Figma
The components are built with the best Figma features, making the design process easy and fast.
Components use the same tokens and naming as the original Ant Design JSON files. You can easily customize the entire UI kit and then sync it with your code.
You can easily apply your branding to the entire UI kit by changing the font, color, and component properties in a few seconds. What is more, you can later sync those changes with your code.
text_fields
Typography
Change the font family, font sizes, or line heights of all components at once in seconds.
color_lens
Colors
Change all colors of the design system or reference other colors from Ant Design with Figma Tokens.
straighten
Spacing
By default, the system uses a 4px grid, but if you need to set up your spacing values, you can also do it in seconds with Figma Tokens.
