Tailwind CSS Typography

Customise your web projects with our amazing Tailwind CSS headings!

The headings are titles or subtitles that you want to display on a webpage. They communicate the organization of the content and guide the users on the page.

Below we are presenting 6 levels of headings that you can use in your Tailwind CSS project. The examples come in different colors so you can adapt them easily to your needs.

<h1>h1. Tailwind CSS heading</h1>
<h2>h2. Tailwind CSS heading</h2>
<h3>h3. Tailwind CSS heading</h3>
<h4>h4. Tailwind CSS heading</h4>
<h5>h5. Tailwind CSS heading</h5>
<h6>h6. Tailwind CSS heading</h6>

Typography Colors

The alert component comes with different colors that you can change it using the class names, below there are some examples of the colors:

<h1 class="text-pink-500">Material Tailwind</h1>
<h1 class="text-blue-500">Material Tailwind</h1>
<h1 class="text-green-500">Material Tailwind</h1>
<h1 class="text-orange-500">Material Tailwind</h1>
<h1 class="text-red-500">Material Tailwind</h1>
<h1 class="text-dark-500">Material Tailwind</h1>

Tailwind CSS Paragraph

Use our Tailwind CSS paragraph example for displaying long text.

<p>Use our Tailwind CSS paragraph example for displaying long text. </p>