Say Hello!
Send us your questions or customization on demand requests
We used to reply ASAP

5 simple steps

before you started to design the system

5 simple steps

Before you started to design the system

Step 1

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.

Step 2

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.

Step 3

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.

Step 4

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.

Step 5

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