Here are some of the most popular design systems by big companies such as Google, IBM, and Apple that you can get inspiration from.
Related: 8 Best Figma Plugins (2021) Design Systems & Developers
What is a design system?
In the field of UI/UX/product design: A design system is a library of design patterns for a company’s/brand’s design language.
A design system can contain guidelines about for example:
- Fonts and font-sizes
- Paddings and margins
- Grids
- Icons
- Color palettes
- UI components (e.g. Buttons, cards, lists)
These guidelines can be saved as reusable UI components in design software such as Figma or Sketch. They can be saved both as design components, as well as in code format (e.g. React components). This is effective and saves time and money because it frees both designers and developers from needing to start from scratch every time. Instead, they can quickly reuse already finished components when creating new designs and products.
Most popular design systems
They are countless design systems out there, but some of the most popular ones are the open-source ones from big companies such as Google, IBLM, Apple, Uber, and Airbnb. Here’s a couple of them with links to where you can find them!
1. Google
Google’s Material Design System >
Google’s material design is an absolute legend when it comes to design systems. I don’t know for sure, but I feel like it’s thanks to Google that so many other companies follow suit on creating design languages.
Google’s design system is also so well made that I even think that it’s a great learning resource for anyone trying to learn UX/UI design. The way they describe all the guidelines can really help you learn what thoughts that went into each component and the design decisions they made.
2. IBM
IBM’s website for their design language is gorgeous. Especially the color section. And I like that they have a specific section about accessibility and contrast ratios, which I think should be a must when creating design systems today.
3. Salesforce
Salesforce’s Lightning Design System >
4. Apple
Apple’s Human Interface Guidelines >
5. Uber
6. Microsoft
Microsoft’s Fluent Design System >
7. Airbnb
8. Shopfiy
Shopify’s Polaris Design System >
9. Mailchimp
Personal Thoughts About Design Systems
Overall I am supportive of design systems because I find that it is much more effective to work with design systems and it saves so much time. However, it’s undeniable that it stifles my creativity in some ways.
I personally prefer to work with design systems as guidelines more than rules set in stone, but that’s something that people can have different opinions about. So that may be one thing that’s important to discuss at the beginning of creating a design system: How much creative freedom do we get away from the guidelines? How much will we need to follow the guidelines?
And it’s also a complex question because if we stray away too much from the guidelines, then we don’t really have a set of guidelines anymore. But at the same time, design is always alive and breathing and evolving. If the guidelines don’t adapt, then the design language can quickly become outdated and less-than other company’s design languages. I guess that in the beginning especially, any design system will need to be flexible and adaptable because the designers will quickly notice when some rules are more in the way than helping, and which guidelines need to be included.
Thanks for reading! Hope this was helpful.