Typography
Typography is one of the most important foundations of an interface and a crucial tool for direct communication with our users. We chose a simple, intelligible and timeless typeface to project our vision.
Proxima Nova for the product
Line-spacing
Line spacing is one of the key elements of a good layout. This value depends a lot on the font. Its default setting should be between 120% and 145% of the font size.
Thanks to line spacing, you can change the amount of space between lines of text, it helps users read long pieces of content throughout the day and minimize reading problems.
Size
In order to guide users through the product, it is key to organize the information. Font size variations help us codify this information hierarchy and they are landmarks for users. They must stay the same throughout the product.
Font-size |
Line-height |
Comment |
25px | 35px | Big title |
19px | 26px | Modals and important cards title |
17px | 23px | Titles |
15px | 21px | Content, paragraphs & labels |
13px | 19px | Small text, dates, mentions, number of comments |
11px | 15px | Really small text (to avoid as much as possible) |
Use of colors
We use a color scheme to differentiate actions and elements within a page. It’s important to keep the same color code throughout our product.
Considerations
- Align all your texts to the left. Some titles and small texts on invitation boxes or cards can be aligned to the middle.
- Avoid leaving large gaps and orphans on a line.
- Try not to leave very short words such as prepositions at the end of a line. Well-considered line breaks can avoid hyphenation of words altogether.
Kozuka Mincho Pro for marketing titles
For any marketing and communication use, we work with the Kozuka Mincho Pro font. This typography helps us to emphasize titles and information while providing our brand with a strong identity.