Edit product

Figma React UI kit — Setproduct Design System

Preview in Figma · React docs · Website

Setproduct Design System is a React-based UI toolkit for the web. Designed and well-organized in Figma. Optimized for building complex data-dense interfaces for desktop and mobile applications. This digital product contains both Figma design files (FIG) and React components (ZIP) which styled and named analogously.

Highlights:

  • 2-in-1 toolkit for design & development. We carefully translated styles and specs from Figma into the React framework to fit with each pixel.
  • Open-source. You're free to modify the code and customize Figma library with new styles. It's easy as a finger click.
  • 30+ categories of components powered by Figma's auto-layout. Every UI item comes with Active, Onhovered, Clicked and Disabled styles (if necessary)
  • Each component is available in two sizes. We've included "Dense" variants for high-density software interfaces.
  • 12 Tokens Color System: 6 tints and 6 shades for 9 base colors as Figma styles to toggle your design into the dark mode (coming soon!)
  • Variety of styles and colors available for every component: Flat, Outlined, Smooth, Raised, Filled. Whether you are an individual or an Enterprise — you'll find a theme for any GUI case:

More than 1,000 happy customers


What's new:

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 organizations

Setproduct Design System is ready to be deployed for team purposes and provides an opportunity to quickstart massive production immediately

For developers

Our Figma library allows you to learn or enhance prototyping 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 design system to concentrate on the consistency, not on start-from-scratch routine


More products for Figma

You've purchased this product

See it in your library

View in Library
Sorry, this item is not available in your location.
Sold out, please go back and pick another option.

0 ratings

  • 2000 components for Figma + restyled BlueprintJS React library
  • Figma library
  • React sources
  • Styled-components
  • Open-source
  • Updates

Checkout

Figma React UI kit — Setproduct Design System

Enter your info to complete your purchase of Business (Unlimited users)

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$396.

Your purchase was successful!

We charged your card and sent you a receipt

    Gumroad Library

    Download from the App Store or text yourself a link to the app

    Thanks for the purchase and Happy Prototyping!

    Need an invoice? Learn more here:

    https://help.gumroad.com/article/40-i-need-an-invoice

    🥇 Don't forget to rate this product ⭐

    Good news! Since you already have a Gumroad account, it's also been added to your library.

    Powered by Gumroad