The 'Why' Behind MDS
Through our brand, we convey our identity and the desired user sentiment associated with our products
Growing with the community
We firmly believe in giving back to the community that has supported us. Matter is our way of contributing to the design and development community and helping others succeed.
Commitment to quality
By creating this UI kit, we demonstrate our expertise and thought leadership in design and development. It's a testament to our commitment to delivering quality solutions.
Our underlying philosophy
Matter aligns with our brand values of collaboration, innovation, and community support. It reflects who we are as a brand and what we stand for in the design and development world.
Features
Where Design Becomes a Masterpiece
01.
Prioritize the UX and usability of UI components with superlative documentation
This design system will allow you to design intuitive workflows with the help of the extensive library of UI components and documentation.
02.
Fully composable design system that treats slots as first class citizens for bigger components
Design and build larger components with the help of the smaller slots components making the design system fully composable. Design and build larger components with the help of the smaller slots components making the design system fully composable.
03.
Intuitively named design tokens based on a designer’s mental model of taking decisions
Power of Figma design tokens with intuitive nomenclature will help you design complex products with ease and hand-off to your developers effortlessly
04.
Layers named using the industry standard BEM naming convention for markup
Front-end (HTML) code compliant layer structure and use of BEM naming convention ensures all components are ready to export from the first minute of file creation.
Fully optimised for
Tokens Studio
Variables and Styles
.svg)
Components following atomic design principles
#FFB17A
color.orange.400
#C2F5CF
color.green.200
#4C8EFF
color.blue.600
Fully accessible palette of 13 colors
Following the
4px
design rule
The ultimate design system repository
you need
The Why and How of Matter Design System
Flexible
Our design system offers unmatched flexibility, allowing you to adapt and customize elements effortlessly & tailor it to your unique brand identity and design requirements.
Scalable
Our system was designed with growth in mind. So with scalability at its core, from small to large projects, it adapts as you grow.
Accessible
Accessibility is paramount in our design system and so we prioritized accessiability, ensuring that your digital products are usable by everyone.
Efficient
Streamline your workflow and reduce design iterations by accessing a comprehensive library of well-documented components and guidelines.
Matter Design system
For any questions you may have...
We might have gotten the answer right here
Why Invest in a UI Kit?
It's a great question! We've been there ourselves, wondering about the value of a top-notch UI kit. The truth is, the true potential of a high-quality UI kit often dawns on you once you've experienced it firsthand. A well-crafted UI kit is a time and money saver; it spares you from the painstaking task of repeatedly creating the same design elements. It's a game-changer that can amplify your productivity by 10 to 100 times.
Is there a free version available?
Absolutely, we offer a free version of Matter Design System for you to explore! It's a robust and expansive UI kit for Figma in its own right.
What are the benefits of a design system?
For Developers, Matter design system provides a streamlined workflow, allowing developers to access design tokens and code snippets directly. This speeds up the development process significantly. And with design tokens readily available, designers can make rapid design changes, test variations, and iterate quickly.
Can I use it for commercial projects?
Of Course you can! The elements in Matter Design System can be used in any type of commercial business, app, project or website.However, you cannot use this to create another UI Kit/Design System or use it to create a product and sell it.
Is it a one-time payment?
Yes It is! No recurring charges or hidden charges!