GitLab utilizes a system font stack. System fonts are the default fonts used by any given OS, helping performance by eliminating the need to download font files.
Body font stack
# Todo: Add codeblock showing body font variable stack
Monospace font stack
# Todo: Add codeblock showing monospace variable stack
The default typography uses line-heights that align with our UI components. Margins are not included to allow for easier alignment with other UI elements. The following scale is used throughout the application:
|12px||The platform for modern developers|
|14px||The platform for modern developers|
|16px||The platform for modern developers|
|20px||The platform for modern developers|
|28px||The platform for modern developers|
|42px||The platform for modern developers|
Content written using markdown includes typography that contains fixed margins and increased line-heights to improve readability. GitLab uses two variations of typography when writing markdown: documentation markdown and compact markdown.
Documentation markdown is defined as any markdown that is written outside of issuable pages, such as a README or Wiki page.
# Todo: Show class used for markdown
Within certain views, the markdown type scale is decreased in order to more closely align copy with other UI components. Compact markdown is used for descriptions and comments on issue and merge request pages.
# Todo: Show class used for compact markdown
GitLab uses 14px as the base size for body copy. This is consistent throughout both the interface and within markdown content.
# Todo: Show base font variable
GitLab uses two font weights within the application: normal and bold. A bold font weight can be used to emphasize specific UI elements, such as a title or input label.
# Todo: Show variables for normal and bold typography
# Todo: Show class used for bold typography
|Normal||The platform for modern developers|
|Bold||The platform for modern developers|