Introducing the Tetrisly Figma Design System
Tetrisly is more than just a Figma design system; it's a comprehensive collection of rules, tools, and processes that streamline the design and development of digital products. As a free design resource, Tetrisly stands out by simplifying complex design tasks.
We don't make overblown claims like other UI kits or design systems. Tetrisly is honest about the design journey—it's neither cheap nor effortless. But with Tetrisly, you work with a Figma design resource that delivers tangible results.
Our rich experience in exploring, designing, testing, and developing products is encapsulated in Tetrisly. Witness our evolution with a completely reimagined approach to the Tetrisly product, three years in the making.
Vision
The value of a Figma design system isn't in the number of components or the size of the product. It's in the quality of documentation and the smooth transition to development.
Our mission with Tetrisly is to provide a free design resource that fosters a vast ecosystem, helping you sidestep common design and development pitfalls.
You can read more about Tetrisly Roadmap
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.
Please reference to this page for Components
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 (20×20, 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.