Basic
Paragraphs are defined with the tag. Paragraph tag is a very basic and typically the first tag you will need to publish your text on the web pages.
A paragraph always starts on a new line, and browsers automatically add some white space (a margin) before and after a paragraph.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nobis, libero iste quod quibusdam maxime recusandae odit eveniet, aspernatur culpa provident error molestiae vitae corporis in vero est! Beatae, ipsum voluptatibus.
<p class="text-base font-light leading-relaxed mt-0 mb-4 text-gray-800">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nobis, libero iste quod quibusdam maxime recusandae odit eveniet, aspernatur culpa provident error molestiae vitae corporis in vero est! Beatae, ipsum voluptatibus.
</p>
Lead
Make a paragraph stand out by adding .text-xl.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nobis, libero iste quod quibusdam maxime recusandae odit eveniet, aspernatur culpa provident error molestiae vitae corporis in vero est! Beatae, ipsum voluptatibus.
<p class="text-xl font-light leading-relaxed mt-6 mb-4 text-gray-800">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nobis, libero iste quod quibusdam maxime recusandae odit eveniet, aspernatur culpa provident error molestiae vitae corporis in vero est! Beatae, ipsum voluptatibus.
</p>
Quote
Use a quotation on your website adding .text-base.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.
<p class="text-base font-light leading-relaxed mt-0 mb-0 text-gray-800">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere
erat a ante.
</p>
<footer class="block text-gray-600">
- Someone famous in <cite>Source Title</cite>
</footer>
Small
Use .text-normal class to make text small.
<small class="font-normal leading-normal mt-0 mb-4 text-gray-800">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nobis, libero iste quod quibusdam maxime recusandae odit eveniet, aspernatur culpa provident error molestiae vitae corporis in vero est! Beatae, ipsum voluptatibus.
</small>
Inline text elements
Styling for common inline HTML5 elements.
You can use the mark tag to highlight text.
This line of text is meant to be treated as deleted text.
This line of text is meant to be treated as no longer accurate.
This line of text is meant to be treated as an addition to the document.
This line of text will render as underlined.
This line of text is meant to be treated as fine print.
This line rendered as bold text.
This line rendered as italicized text.
<p>You can use the mark tag to <mark class="bg-blue-200">highlight</mark> text.</p>
<p><del>This line of text is meant to be treated as deleted text.</del></p>
<p><s>This line of text is meant to be treated as no longer accurate.</s></p>
<p><ins>This line of text is meant to be treated as an addition to the document.</ins></p>
<p><u>This line of text will render as underlined.</u></p>
<p><small>This line of text is meant to be treated as fine print.</small></p>
<p><strong>This line rendered as bold text.</strong></p>
<p><em>This line rendered as italicized text.</em></p>
If you are looking for more advanced options, try Bootstrap Typography from MDBootstrap.