About
Tetrisly Design System is a collection of rules, tools and processes which simplify design processes and the development of digital products.
We are not just another UI kit or design system that claims to provide the best UI components to boost a design process and make it effortless. We also won't promise you that you will build your project with just a few clicks and save thousands of hours.
That's because that is simply impossible. Building a design system is neither cheap nor easy. No empty promises. Work with a tool that gets you the results you need.
Our experiences exploring, designing, testing and developing products was packed into Tetrisly. The best example of this is a completely new approach and a reimagined Tetrisly product after three years of being on the market.
Vision
The number of components and the product size are not measurements of value nor the keys to success. A lack of documentation and poor hand-offs to developers cause many issues not only for design teams but also for the end-users, who end up frustrated with the product.
Our mission is to deliver resources that create a huge ecosystem and help you avoid such issues.
Key Features
Focus on product delivery
Don't waste time reinventing components and looking for the most suitable library structure. Save money and resources by replacing this process with a tool that does it all. Focus on product improvements, design right away and ship faster.
No more junk components
The usefulness of a design library shouldn't be measured by the number of components or variants it has. Get rid of junk inside your library. Ensure it only has carefully selected and customizable components without UX mistakes.
Design System Tool, our plugin for Figma
Bring design tokens to life. Boost your components. Automate creating Design System. Download Design System Tool plugin ↗
Documentation and React components are in progress
The Tetrisly team is continuing to work on usage documentation and React components. These deliverables will help our users deliver their products faster and ensure quality, usability and unified experiences for their users.
Super-charged by 400+ designers and engineers
Tetrisly is part of VirtusLab — a global software engineering company. That’s why we have cutting-edge technologies written in our DNA. Our expertise focuses on UI/UX Design and Design Systems. We aim to bring a human face and common understanding to your product before it’s coded.
Design Tokens
Each component is prepared based on Design Tokens. Design Token is a semantic representation that helps understand how or when the token should be used. It helps to limit design decisions and place them in specific contexts.
Contrast-based and intuitive color system
The whole range of colors is scalable and consistent, all of them shining in the same way. Each color is prepared based on WCAG standards. Our unique naming system allows you to add new shades easily. The color system is designed within the HSL color space.
Tetrisly Icon Library
A clean, consistent, and pixel-perfect icon set (20x20, 1.5px) crafted specifically for modern UI design.
Resources
Tetrisly for Figma
Tetrisly is constantly updated with the newest Figma features like auto-layout, properties, nested instances and more.
Tetrisly for React
We’re working on it.
Design System Tool
Create multilevel relationships between design tokens and placed them in specific contexts. Inheritance ensures global propagation and unified product experiences.