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