Texts

In this section, we are going to give you an overview of all the typography of Milestone Systems website.

Here are the different text definitions used all over Milestone website for each purpose.

Table of contents

Displays

<div class="msds-text-display-1">Display 1</div>
<div class="msds-text-display-1-regular">Display 1 - Regular</div>
<div class="msds-text-display-2">Display 2</div>
<div class="msds-text-display-2-regular">Display 2 - Regular</div>
<div class="msds-text-display-3">Display 3</div>
<div class="msds-text-display-3-regular">Display 3 - Regular</div>

Headers

<div class="msds-text-header-1">Header 1 - Light</div>
<div class="msds-text-header-1-bold">Header 1 - Bold</div>
<div class="msds-text-header-2">Header 2 - Light</div>
<div class="msds-text-header-2-bold">Header 2 - Bold</div>
<div class="msds-text-header-3">Header 3 - Bold by default</div>
<div class="msds-text-header-3-light">Header 3 - Light</div>
<div class="msds-text-header-4">Header 4</div>
<div class="msds-text-header-5">Header 5</div>
<div class="msds-text-header-6">Header 6</div>

Leads

<div class="msds-text-lead">Lead - Light</div>
<div class="msds-text-lead-bold">Lead - Bold</div>

Body Text Definitions

<div class="msds-text-body-0">Body text 0 - Regular</div>
<div class="msds-text-body-0-bold">Body text 0 - Bold</div>
<div class="msds-text-body-0-italic">Body text 0 - Italic</div>
<br />
<div class="msds-text-body-1">Body text 1 - Regular</div>
<div class="msds-text-body-1-bold">Body text 1 - Bold</div>
<div class="msds-text-body-1-italic">Body text 1 - Italic</div>
<br />
<div class="msds-text-body-2">Body text 2 - Regular</div>
<div class="msds-text-body-2-bold">Body text 2 - Bold</div>
<div class="msds-text-body-2-italic">Body text 2 - Italic</div>
<br />
<div class="msds-text-body-3">Body text 3 - Regular</div>
<div class="msds-text-body-3-bold">Body text 3 - Bold</div>
<div class="msds-text-body-3-italic">Body text 3 - Italic</div>
<br />
<div class="msds-text-body-4">Body text 4 - Regular</div>
<div class="msds-text-body-4-bold">Body text 4 - Bold</div>
<div class="msds-text-body-4-italic">Body text 4 - Italic</div>
<br />
<div class="msds-text-body-5">Body text 5 - Regular</div>
<div class="msds-text-body-5-bold">Body text 5 - Bold</div>
<div class="msds-text-body-5-italic">Body text 5 - Italic</div>