This website requires JavaScript to deliver the best possible experience.


Typography is used as a guideline for the readers’ eye so theycan scan through and enjoy a seamless readbility experience while they scan through texts and supported with Base aligned structure.


While using typography, make sure every word you place is consistent with the overall viual pattern and helps facilitating the user interaction experience.

Type Scale

We always detemine the next type scale step based on the previous one. that’s why we have this math:



X : step n type size X₁ : step n-1 type size

The gap between two steps is always based on increments of 2. It’s a non-linear arithmetic progression, providing a smaller interval (Slope) for smaller type and a larger interval (Slope) for large type,giving us a wide range of scales . it provides sensible value and works well in a digital environment.

Typography Usage

Texts are used to keep hierarchies clear and consistant. While working on any interface, select the text sizes, styles and that matches with your UI and enriches your design with a balanced look.

Typography Weight

Font weight is used to defiietentae and emphasis on certain parts of the text like headlines and side notes. In the same font size, using a bold weight adds more emphasis than lighter weight. However, a lighter weight can give more emphasis than bold weight when used with a significantly larger size. When using different fonts and sizes in the same design, pay attention to the overall design look and balance.