Send us your questions or customization on demand requests
Thanks for your message!
Send your message
We used to reply ASAP
Learn about Material Design System kit
5 simple steps
before you started to design the system
5 simple steps
Before you started to design the system
Determine all the repeating elements in your layout, prototype or concept. As the example below we have repeating card, repeating image and repeating floating action button.
Form a list of all possible states of any component, depending on the system response or users' actions. For example, disabled input or onhover state.
Now start your components development process. Keep in mind to set constraints immediately, it helps to avoid routine, when there will be a lot of elements.
Duplicate specific component to create additional states. Use detach instance function, then add the necessary changes and clone it. Use accessible and valid names of components.
Continue assembling your design system this way. Drag and drop the component, adjust size and indents according to your design plan.
Design system live
240+ components awaiting
Application bar, Avatars, Badges, Bottom nav, Buttons, Cards, Chips, Dialogs, Drawers, Expansion panels, Grids, Lists, Menus and more...
Explore Material Design System kit
Download for Figma
What you will get :
PURCHASE ONCE AND USE FOREVER
• Production-ready prototyping kit
• 240+ UI modules 300+ material icons as components
• Responsive resizing with constraints set
• Developer's timesaver with CSS, XML, Swift export
• Constantly updating product → v1.4 in March
ADD TO CART
For commercial use
Design and prototyping
like fitting the puzzle
Guaranteed timesaver for designers, web developers, software engineers and product managers
© Setproduct.com • 2018 • All rights reserved •
✉ Send your offers, requests, feedback