...
| rem | px | Actual size |
|---|
| 0.75rem | 12 px |
| Html macro |
|---|
<span style="font-family: arial; font-size: 12px;">Good>Powering design is good business<actionable intelligence</span> |
|
| 0.875rem | 14 px |
| Html macro |
|---|
<span style="font-family: arial; font-size: |
actionable intelligence</span> |
|
| 1rem | 16 px |
| Html macro |
|---|
<span style="font-family: arial; font-size: 16px;">Good>Powering design is good business<actionable intelligence</span> |
|
| 1.125rem | 18 px |
| Html macro |
|---|
<span style="font-family: arial; font-size: 18px;">Good>Powering design is good business<actionable intelligence</span> |
|
| 1.25rem | 20 px |
| Html macro |
|---|
<span style="font-family: arial; font-size: 20px;">Good>Powering design is good business<actionable intelligence</span> |
|
| 1.5rem | 24 px |
| Html macro |
|---|
<span style="font-family: arial; font-size: 24px;">Good>Powering design is good business<actionable intelligence</span> |
|
| 1.75rem | 28 px |
| Html macro |
|---|
<span style="font-family: arial; font-size: 28px;">Good>Powering design is good business<actionable intelligence</span> |
|
| 2rem | 32 px |
| Html macro |
|---|
<span style="font-family: arial; font-size: 32px;">Good>Powering design is good business<actionable intelligence</span> |
|
| 2.25rem | 36 px |
| Html macro |
|---|
<span style="font-family: arial; font-size: 36px;">Good>Powering design is good business<actionable intelligence</span> |
|
| 2.625rem | 42 px |
| Html macro |
|---|
<span style="font-family: arial; font-size: 42px;">Good>Powering design is good business<actionable intelligence</span> |
|
| 3rem | 48 px |
| Html macro |
|---|
<span style="font-family: arial; font-size: 48px;">Good>Powering design is good business<actionable intelligence</span> |
|
| 3.375rem | 54 px |
| Html macro |
|---|
<span style="font-family: arial; font-size: 54px;">Good>Powering design is good business<actionable intelligence</span> |
|
| 3.75rem | 60 px |
| Html macro |
|---|
<span style="font-family: arial; font-size: 60px;">Good>Powering design is good business<actionable intelligence</span> |
|
| 4.25rem | 68 px |
| Html macro |
|---|
<span style="font-family: arial; font-size: 68px;">Good>Powering design is good business<actionable intelligence</span> |
|
| 4.75rem | 76 px |
| Html macro |
|---|
<span style="font-family: arial; font-size: 76px;">Good>Powering design is good business<actionable intelligence</span> |
|
| 5.25rem | 84 px |
| Html macro |
|---|
<span style="font-family: arial; font-size: 84px;">Good>Powering design is good business<actionable intelligence</span> |
|
| 5.75rem | 92 px |
| Html macro |
|---|
<span style="font-family: arial; font-size: 92px;">Good>Powering design is good business<actionable intelligence</span> |
|
Typographic treatments
...
Verint allows for a wide range of weights. However, only Semi-Bold, Regular, Light should be used for product design.
| Weight | Example |
|---|
| Font-weight: 300 / Light |
| Html macro |
|---|
<span style="font-family: arial; font-size: |
|
62px32px; font-weight: 300;">Light 300</span> |
|
| Font-weight: 400 / Normal |
| Html macro |
|---|
<span style="font-family: arial; font-size: |
|
62px32px; font-weight: 400;">Normal 400</span> |
|
| Font-weight: 600 / Semi-bold |
| Html macro |
|---|
<span style="font-family: arial; font-size: |
|
62px32px; font-weight: 600;">Semi-bold 600</span> |
|