Typography

All text in the system should be consistent in terms of font, sizes and colors.

Text colors

All text should by default be black (see colors section of the design guide). In case the text refers to an inactive element, the grey text color should be used.

Font family

The font should always be the Quicksand font, as the customers prefer that the font is similar to how the citizens learn to write, especially in relation to the letter a.

Font size

The font size should follow the declared sizes in the file font_sizes. In the file the font sizes for pictograms (150), timers (50) and the buttons for the activity screen (23) are declared. Besides these there are also 3 general font sizes for the rest of the application, these being declared as small (20), medium (24) and large (30). These are used for general text in the app and can be used as the developer sees fit.

Bold, italic and underlined text

The text should never be bold, italic or underlined in order to maintain a consistent design.


Last update: December 12, 2023