Overview
Typography is the art and technique of arranging type to make written language legible. In the Abyss library, Heading, Text, and Link dive into the detail behind text formatting for Optum branding. More in-depth guidance on typography can be found below and on the Optum Brand Page.
Principles
Readability: Ensure readability by keeping it simple with two typefaces that complement and contrast with one another.
Scalability: Define and apply a typography scale that works in different platforms, no matter the screen size.
Hierarchy: Creating a strong hierarchy is paramount to helping users identify where to look first, guiding them to the most important elements of the screen.
Abyss typography uses minor 3rd scaling. The base is 16px for desktop and 14px for mobile.
Sans-serif headings
Note: The term "Abyss" prefixes fonts such as "Enterprise Sans VF" in the documentation under Font Family. This is because from a code perspective, Abyss hosts the font files that are provided directly from Brand on our own CDN.
Desktop
Mobile
Paragraph
Size is the same in both desktop and mobile.
Links
Size is the same in both desktop and mobile.