Effective typography is crucial for establishing clear hierarchies, organizing information, and guiding users through a product or experience.
It plays a significant role in creating visually appealing and user-friendly designs.
Our Typeface of Choice: Roboto
We rely on the open-source typeface Roboto for our designs.
It can be accessed and downloaded from the Google Font - Roboto
We use Roboto for all designs, except for logotypes and sub-brands, which utilize a custom font.
Although Roboto offers multiple variants, we exclusively use the Sans variant for our projects. We discourage the use of other variants, such as Condensed, Serif, and Mono. Please ensure that you avoid incorporating Serif in any design projects, as Sans remains our preferred choice.
Roboto has 6 weights, and they are: thin, light, normal, medium, semibold, bold
It is important to maintain these type pairings. This allows for clarity, consistency, and a strong hierarchy for all communications.
Medium weight should be paired with Light weight, and Semi bold weight should be paired with normal weight.
It is important to organize typography in a hierarchical system according to relative importance or inclusiveness through scale and function depending on communication.
in three lines and
set in medium
of the headline and set in light
bold headline
of the headline and set in normal
two lines long
of the headline and set in normal
Typography should either be black on light imagery or white on dark imagery.
Text must be easily readable when it is placed on top of an image.
If the text is not quite readable on the image, overlay the image with a gradient .
Split the surface, don't overlay, if possible.
Standalone image looks nicer, and they are more effective
Moreover, the text becomes more concentrated, while the image remains sharp and can convey a powerfull message.
on light images
on dark images
text is not readable
