Design System UI Kit for Figma 7.0
The best-selling Design System UI Kit for Figma
UI Prep’s Design System UI Kit for Figma is the best-selling practical design system for real-world products and websites. It’s why design teams from Nike, Mud/Wtr, OpenTable, Nasa, and Kellogg use UI Prep to jumpstart design projects, save hundreds of hours, and level up as designers.
Thousands of designers already use UI Prep to level up. Are you ready? Get it now.
Back to uiprep.com • Preview in Figma
Design Best Practices: Fully Accessible, 8pt Grid, Atomic Design, Documentation, Responsive, Light & Dark Themes.
Newest Figma Features: Component Properties, Variants, Auto Layout, Interactive Components.
More Than a Design System: Quick Start Guide with detailed tutorials
Buy once, use forever
Get lifetime access to the Design System today, plus any updates we release in the future for a simple one-time price.
Loved & Trusted by 100,000+ designers across the world
"This is a fantastic design system. Best thing on Gumroad hands down!"
UX/UI Designer, Fidelity Investments
“I would highly recommend this UI Kit! It was a well organized design system with a variety of components to select from and simple to get started! This kit has dynamic components and is easy to customize my designs. Overall, a great product!”
UX/UI Designer, H&R Block
“UI Prep has been instrumental in our agency work. UI Prep helps us start at 60% instead of 0%. It’s comprehensive, organized, and very thoughtfully designed. I could not recommend this more.”
Principal Product Designer, Innovate map
“UI Prep is more than just ‘a Figma template’. It teaches you the best way to work! It is packed with the best Figma features to help you design better and more effective! UI Prep really shows you how it’s done. If you’re not using this, you are missing out. Don’t think ‘template, think design system! I love the fact I can become a better designer just by using UI Prep!
Owner at IMAGA
“UI Prep is some of the best money we've spent in the life of our company. It has been absolutely critical for us to get our product up and running. As a startup with no dedicated UX resource, we have to be able to make the most of our time and assets. UI Prep helps us hit the ground running, and not waste time reinventing the wheel.”
Head of Product at Uncovered
“The UI Prep toolkit has been invaluable for our small team in the few short months that we've had access to it - if only we'd found it sooner!
Senior UX Designer, Publicis Worldwide
“The UI Prep is an amazing tool for both quick mockup/prototyping and detailed UI design. It's super easy to use and speeds up the work in a way I couldn't imagine. The infinite number of possible combinations and customizations makes it the perfect tool for any designer and team, highly recommended!”
Head of Design, Asia Focus Group
“l love the attention to structure/approach taken to build the system. By far one of the best organized and structured kits out there, especially with the base components and use of variants.”
Lead Product Designer, Nomos One
“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. Regardless of whether you need to create a bespoke design from scratch or a quick, rough mockup this is a great product. 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.”
Digital Product Designer, Teknasyon
Latest Release 7.0
Updated to include the latest Figma updates. Including new property & variant features (ex. exposed nested variants, preferred variants, simplified components). In addition to many component improvements and additions.
- Newest property features
- Newest Auto Layout features
- Improved Table
- Improved Buttons
- Improved Inputs
- New Components
Frequently Asked Questions
See full FAQ on our website
How do I import the design file into Figma? First, download and unzip the design file. Then, drag and drop the file into your Figma “Project” page or your “Drafts” page.
How do I download a new update? In your Gumroad Library, select the “UI Prep Design System for Figma” product card, then select “download”.
Can I get the Design System UI Kit for my entire team? Yes, you just need to select the appropriate license when you check out. We offer an individual licenses (one designer) and a team licenses (unlimited designers).
Email me at firstname.lastname@example.org or DM me on Twitter.