Resources
∙
27 May, 2024
∙
10 minutes
A compilation of the most carefully crafted UI kits and design systems for UI/UX designers that will speed up your work in Figma.
Companies trying to create consistent digital experiences for their customers have to make hundreds of design decisions every day. Instead of approaching each decision on a one-off basis, Design Systems, Wireframe and UI kits provide repeatable solutions to common design problems, like what font to use, where to place an image, or how an entire website can meet accessibility standards. A systems approach to design reduces the number of one-off decisions people need to make and creates more consistent results.
This is a collection of reusable components with clearly defined standards for use. These components combine pattern libraries, colors, and fonts with standardized design principles to help companies achieve consistent visual design at scale. Design systems embed these building blocks of design into teams and workflows to create consistent user experiences even when design is distributed among numerous designers and other creators.
Beyond UI is a premium UI kit and design system for Figma. Beyond UI is the only UI kit and design system for Figma that uses the slot feature for creating landing pages and websites.
All components in Beyond UI are crafted with a super-smart approach, great dedication and feature the most modern functionalities provided by Figma, such as Auto Layout 5.0, Nested Instances, properties, and variables. This allows us to create thousands of possible instances from just a few master variants of a single component, resulting in quick and easy management of pages and components.
The slots feature in Beyond UI for creating landing pages in Figma allows designers easier management and flexible customization of pages and sections. This approach is better optimized than traditional UI kits, where one component equals one instance.
Beyond UI uses variables and tokens for colors and spacing, enabling dark mode and responsiveness with a single click. Beyond UI includes the most modern Figma components, website pages, as well as components and pages tailored for web applications (SaaS).
The price of Beyond UI for a single license is $97, and it comes with 400+ variables and tokens, 5000+ components that can be used to create millions of instances, website sections, and pre-designed pages for web applications.
Beyond UI is a great starting point for any designer, suitable for projects ranging from simple to complex.
On the market for several years now, Untitled UI is undoubtedly one of the most popular UI kits and design systems for Figma ever.
Untitled UI contains everything necessary for any design project, from websites to complex web applications.
Untitled UI has retained the traditional way of creating components. It's meticulously crafted with 100% Auto Layout 5.0, super-smart variants, Figma's newest variables features, and with accessibility in mind. This design system includes 10,000+ components and variants, 900+ useful global color, typography, and effects styles + variables, and a whopping 420+ beautiful mobile and desktop page examples, making it one of the largest and most complex UI kits on the market.
Untitled UI comes with Free and PRO versions, with the PRO version starting at $129 per user
The Detachless UI Kit for Figma is a fantastic free resource that makes web design easier and faster. It's packed with a variety of components and styles that help you create beautiful designs with less effort.
With Detachless, you can quickly get your web projects up and running. It includes all the tools you need for a smooth and cohesive design process, making it a great asset for any designer wanting to boost their efficiency and creativity in Figma.
Landify is a landing page UI kit for Figma consisting of 170+ "blocks", 500+ components, icons, color styles, and 5 sample pages. It's a great asset to quickly spin up beautiful marketing websites in no time.
Originally launched in 2020, designer Aravind Little Jack has spent countless hours updating this UI kit with tablet and mobile breakpoints and relaunched v2.0 in January 2022. Check out the free UI kit on Figma Community.
It's well-organized and includes color styles, text styles, as well as some great examples of landing page components. While it's focused purely on website designs and missing application components, one thing we love about this UI kit is that it comes with tablet breakpoints. Most UI kits skip this as it can quickly bloat design files, but Landify is slim enough to include this breakpoint.
Frames X was created at the end of 2021 by Dmitriy Bunin and is an excellent example of a mid-weight design system for Figma.
Frames X comes with 5,500+ reusable components and variants built with Auto Layout and dark mode, color styles, icons, and 420+ "building blocks" to help you get started on websites and apps.
This design system offers a straightforward and adaptable pricing plan: the Solo version is $109, the Team version (1 to 3 users) is $249, and the Unlimited license for an unlimited number of users is $599.
Are you fed up with recreating the exact details for every project, constantly setting up the same components to be responsive, or even just feeling a little disorganized across the board?
Shipfaster UI 2.0 is here to make your life even better as a UX/UI designer.
In this design system, you will get immediate access to:6,000 components and variants, 150+ global styles, 2,800+ media resources, 140 custom-designed, expertly crafted page examples, useful light or dark mode100%, responsive components, lifetime access and free upgrades!
Base 02 is a minimal yet highly complete mid-weight UI kit and design system, created by Pixsellz.
The Pixsellz team has included the latest Figma variables features, including color variables for light and dark modes.
The Figma file is nicely organized and includes all the basic UI components as well as a library of 1,000+ icons.
The price of this design system starts at a minimal $38 for a Single License, $136 for a Team License (up to 5 users), and $272 for an Enterprise License (up to 15 users).
Cabana is a UI kit for Figma and Framer. Cabana UI contains 1,000+ essential UI components and design "blocks" that you can use to construct page layouts quickly.
Cabana has several pricing variations starting from $99 for Framer only, $109 for Figma, and $149 which includes both Figma and Framer.
Ant Design is a powerful UI kit for Figma based on the most popular React UI library - Ant Design.
Ant Design comes with several packages for personal and team licenses. The Basic Package starts at $109 USD, which includes an Ant Design System for Figma and one year of free updates for this product.
Bite is built around the utility classes available in the Tailwind CSS framework, which means that you can integrate a design built with this kit using Tailwind CSS without writing any extra HTML classes.
Fun fact: their landing page was also designed in FlowBite and coded with Tailwind CSS.
FlowBite offers several pricing packages starting with the Free Version, Designer edition for $159, and Developer edition for $279.
If you are looking for a modern design system for SaaS, you are in the right place.
AlignUI was created in December 2023 by Erşad Başbağ, Melis Bıyıkçı, and Kerem Yıldan.
It contains 5900+ components, unique widgets, dashboards, and more, providing a lightning-fast experience on Figma.
The price of this design system is $119 for a single-user license and $349 for a Team license (2-5 users).
Tetrisly Design System is a carefully crafted UI library with usage guidelines and a Figma plugin for easier customization. Deliver your React apps faster.
It consists of 2,500+ components, 55 predefined color styles, and 700+ icons.
Pricing for the Figma version starts from $99 for a single license charged annually.
Disy is lunched in January 2022, by Yoan Almeida. Disy is a minimal and simple design system and UI kit.
Disy comes with 280+ icons, 400+ basic components with Auto Layout, color styles, and a couple of beautifully crafted example pages to explore new ideas or kickstart that new project.
Even the price is minimal — at just €48, it's a small investment to speed up your design process and workflow.
Keep is a simple design system that comes for both Figma and React, setting it apart from traditional design systems.
This design system comes with basic components for Figma, and its price starts at $99 for a single license and $249 for a Team license (up to 10 users).
Minimal is a design system for React that also includes a Figma UI kit.
Unfortunately, Minimal does not include some of the latest features provided by Figma, such as variables.
Minimal includes all the basic UI components as well as basic pages for web applications. Its price, which includes the Figma file starts from $129.
June marked the beginning of Apple’s Worldwide Developer Conference (WWDC23), and this year brought a surprising twist: Apple, known for its long-standing use of Sketch, unveiled its inaugural official design kit for Figma.
Within this Figma Community file, users will discover a wealth of resources dedicated to iOS 17 and iPadOS 17. From a comprehensive array of components, views, and system interfaces to meticulously crafted text styles, color styles, materials, and layout guides, the file is a treasure trove for designers.
For those in search of native iOS components, this file provides virtually everything needed to swiftly craft highly realistic iOS and iPadOS app designs. Apple has also pledged ongoing enhancements to the library, along with plans for expansions and the creation of separate libraries catering to Apple Pay.
Module UI is a simple and minimalistic UI kit for Figma created by Vitaly Belousov.
Module UI kit contains all basic components needed for your next project, well-defined spacings and styles.
The price for the Module UI kit starts from $98 for a lifetime personal license.
Preline UI is an open-source set of prebuilt UI components based on the utility-first Tailwind CSS framework.
Preline UI Figma is the largest free design system for Figma.
Share post
