Figma React UI kit Design & code
31 category of components, 3700+ variants, 60 dashboard templates designed in Figma and exported to React to build web apps faster.
Design System for Figma & React
Swap between the native or custom style. Apply your styleguides faster
3700+ variants of 31 components
Best practices from the most successful apps included in this kit
Ready for deep themification
Named, organized and constrained iOS library to skip the pixel routine
60 dashboard templates
Start screen, Analytics, Data grid, Profile, Settings, Inputs and more to come
Figma & React templates to building web apps faster
Figma design system UI kit
Library of components powered by Figma's auto-layout and Variants. States are supported: Active, Onhovered, Clicked and Disabled. Loaded with 60 templates either
Styled Blueprint.js React
React-based UI toolkit for the web. Optimized for building data-dense interfaces for desktop and mobile apps. All the UI specs match with components in Figma
Preview 3700+ components
Preview 60+ templates
Get started⚡
Figma UI kit
31 components, 3700+ variants, 60 dashboard templates crafted for Figma and fully ready-to-use with, or without modifications.
Figma & React UI kit
31 components, 3700+ variants, 60 dashboard templates crafted for Figma and exported to code, basing on restyled Blueprint.js React library. View Docs →
3700+ variants for 31 components
Designed in Figma then translated to React. Organized & named to match between design & code, crafted with Auto‑layout & Variants. Easy to play with styles and customize.
60 responsive web app templates
Reusable dashboard layouts in 5 popular categories: Start screen, Analytics, Tables, Profile, Settings, Inputs and more to come. Designed with care of usability and attention to UX details.
Hire us to custom design & code! Let's build together ✊
FAQs
How to start with this design system?
After the successful purchase via Gumroad (it's safe and encrypted) you will be taken to a download page. You will also get the download link in your email (check the SPAM folder sometimes). Then just simply drag and drop .FIG file onto your Figma app. Do not drop it onto the project. Drop it over the starting screen with recent projects grid.
l am new to Figma. Should I try your kits?
Definitely! Our products help customers who learning Figma from scratch. By exploring and studying commercial UI kits you learn how the components and layouts were crafted, which styles being used and which styling tricks have been applied.
How to import your kits?
Importing .FIG files into Figma: https://help.figma.com/hc/en-us/articles/360041003114-Import-files-to-the-file-browser
Which license type should I choose?
You must select the proper license type according to the number of users in Figma if you're purchasing our product for the business.
Business license — for startups or enterprise organizations to use for a local team or publish in Figma library.
Individual license — for freelancers, indie developers, or solopreneurs working on a single project.
Can I build commercial proiects with your products?
Yes! You can build an unlimited amount of commercial projects using Setproduct assets. But, please, consider a license type before making a purchase.
I have a project. Can I hire you?
We're open-minded to your custom design & development projects. We can create complex templates based on our Figma libraries and code them in the production using a wide variety of popular frameworks and technologies.
If you have a project to design & develop, simply contact us describing your brief, budget, and expectations.
I 💜 Your designs, but can I have a discount?
We provide discounts for those, who scrolled to the bottom and revealed our proposal. Just drop us a message with a short story about how you plan to use our product and we will give you a ✨30% off coupon for the upcoming purchase. Please, provide a specific product name you've put your eye on.