Typography
Typography organizes content and creates hierarchies. It brings consistency across web properties.
Headings
To obtain this result, use h1
| h2
| h3
|
h4
| h5
| h6
tag.
Lorem ipsum dolor sit
Lorem ipsum dolor sit
Lorem ipsum dolor sit
Lorem ipsum dolor sit
Lorem ipsum dolor sit
Lorem ipsum dolor sit
Text Sizes
To obtain this result, use p
tag txt-2xl
|
txt-xl
| txt-lg
|
txt-md
| txt-base
| txt-sm
class name.
Lorem ipsum dolor sit
Lorem ipsum dolor sit
Lorem ipsum dolor sit
Lorem ipsum dolor sit
Lorem ipsum dolor sit
Lorem ipsum dolor sit
Text Weights
To obtain this result, use p
tag font-bolder
|
font-extrabold
| font-bold
|
font-semibold
| font-medium
| font-medium
class name.
Lorem ipsum dolor sit
Lorem ipsum dolor sit
Lorem ipsum dolor sit
Lorem ipsum dolor sit
Lorem ipsum dolor sit
Lorem ipsum dolor sit
Text Alignments
To obtain this result, use p
tag txt-center
|
txt-left
| txt-right
|
txt-justify
class name.
Center : Lorem ipsum dolor sit
Left : Lorem ipsum dolor sit
Right : Lorem ipsum dolor sit
Justify : Lorem ipsum dolor sit amet consectetur, adipisicing elit. Laudantium vel accusantium dolorum! Repellendus, omnis suscipit, sunt dolore eveniet placeat eum esse temporibus numquam exercitationem nisi at similique quo laborum soluta.
Text Colors
To obtain this result, use p
tag txt-normal
|
txt-default
| txt-primary
|
txt-secondary
| txt-active
| txt-grey
class name.
Lorem ipsum dolor sit
Lorem ipsum dolor sit
Lorem ipsum dolor sit
Lorem ipsum dolor sit
Lorem ipsum dolor sit
Lorem ipsum dolor sit