Edit product

Figma React UI kit — Setproduct Design System. Design & code toolkit for web apps

31 components, 3700+ variants, 60 dashboard templates 

Figma React UI kit — designed in Figma and exported to React to build web apps faster. Based on restyled Blueprint.js library. Powered by Figma's auto-layout. Allows toggling between styles quickly with Variants: Flat, Filled, Raised, Outlined and Smooth (Shaded). Themed into ⚪🔵🟢🔴 to swap components style with ease.

Figma preview · React · Live demo · Website


Highlights:

  • Design System for Figma & React to quickstart. The fullest UI kit was made in advance for Figma then synced with React via the styled Blueprint.js library.
  • 3700+ variants of 31 styled-components. Organized & named to match between design & code, with Auto-layout & Variants. Easy to customize.
  • Ready for deep themification. Color tokens, Font styles, Reflexed shadows to allow you quickly remix styles to produce custom-themed templates.
  • 60 dashboard templates. Start screen, Analytics, Data grid, Profile, Settings, Inputs and more to come in upcoming updates which are free.

More than 2,000 happy customers


What's new:

Version 2.2.0 with web app templates: Home, Dashboard (Charts), Tables, Profile (Settings), Inputs. New components: Spinners. Design system in Figma upgraded with Variants.

Version 2.1.0 with new components: Badges, Dropdowns, Calendar with Range, Toasts, Tooltips. Some architecture (React) improvements to prepare for templates.

Version 2.0.1 includes some minor bug fixes + New components: Hamburger menu effects, Timepicker, Datepicker (range is coming soon), ButtonGroup.


For businesses & startups

Setproduct Design System is aimed at serious teams where designers and coders will collaborate more efficiently. Our product saves your time, money and pushes the release.

For developers

Our Figma library allows you to learn or enhance interface design skills. Simply dip into the design process, where you only need to drag, drop and fit. That’s it!

For designers

Skip creating from scratch those boring UI items along with a project. Use our Figma React to concentrate on quickstart, not on the designing from scratch routine.


Refund policyLicensing agreementMore for Figma

11 ratings

  • Figma design sources (.FIG) + customized BlueprintJS React library (.ZIP)
  • React components31
  • Figma variants3700+
  • Web app templates 💻/📱60
  • Figma auto-layout
  • React sources
  • Styled-components
  • Open-source
  • Updates

Checkout

Figma React UI kit — Setproduct Design System. Design & code toolkit for web apps

Enter your info to complete your purchase of Individual PRO (1 user)

Card

···· ···· ···· 4242
Test card

05/18

Card

Use a different card?

Card

pp paypal

or pay with

We do not keep any of your sensitive credit card information on file with us unless you ask us to after this purchase is complete.

or pay with

You'll be charged US$258.
Powered by Gumroad