Design system as a support tool for your project

A design system is the best way possible to start your project faster, saving you so much time and energy. Think of a collection of reusable components, like a library, where you can easily provide consistency on pre-built UI elements.

Creating a design system is the only source of truth to run a project with a whole team of others designers and developers who all work with a unique purpose to focus on the client's project. It gives you and your team more freedom to work without having to worry about the next steps.

To start a design system here are the most important elements that your project needs:

• Colors
• Typography
• Shadows
• Icons

After you are done collecting all the elements that I mentioned before, you can focus on:

• Buttons
• Inputs
• Modals
• Cards
• Dropdowns
• Placeholders and so on...

Tip: If you can, don't build a design system from scratch all by yourself. Design is increasingly becoming more complex and with all those information inside your head it will decrease the quality of your job. So have all your team involved to brainstorm, create and support a unique process.

There are tons of plugins that can make the whole creation process even quicker!

• Tint and shade generator
• Color Palettes List
• Color Search

For Typography:

• Test different fonts with Font Explorer
• Look a preview with Better Font Picker
• Generate font combinations with deep learning

Final Thoughts

There are tons of design systems you can copy or use as an example to build yours. Keep in mind that this process takes time but gives you many benefits. Don't be attached to the details because perfection doesn't exist. Speed first, quality later!