Profile PictureTetrisly Design System

Tetrisly Color Palette


The whole range of colors! Color system for designing accessible apps with a wide range of color shades.
Scalable and consistent, all of them shining in the same way. Each color is prepared based on WCGA standards with a completed contrast ratio test.

  • 14 colors and their shades
  • Color Tokens - Content, Backgrounds, Borders, Actions, Interactive, Non-contextual, etc.

Tetrisly Colors are contrast-based and intuitive

Our unique naming system allows you to add new shades after or before the base color. And no matter which color you use, everything will work well thanks to premade steps and contrast-based colors. The color system is designed within the HSL color space.

Color Tokens are here!

Color Token is a semantic representation of the color that helps understand how or when the token should be used. It helps to limit design decisions and places them in specific contexts. Token can inherit the value from another token (i.e. Semantic / Positive / Normal inherits the value from Global / Green / 0).

Below you can see the illustration shows the tokens’ relationship:

Well crafted and grouped!

We're focused on the presentation of colors and making it intuitive. Working with those is super easy.

Tetrisly Color Palette is created by Tetrisly.

Feel free to email us via

Add to cart
4.49 MB

Tetrisly Color Palette

Add to cart