rembrembdocs

font-style

Utilities for controlling the style of text.

ClassStyles
italic
font-style: italic;

| | not-italic |

font-style: normal;

|

Use the italic utility to make text italic:

The quick brown fox jumps over the lazy dog.

<p class="italic ...">The quick brown fox ...</p>

Use the not-italic utility to display text normally:

The quick brown fox jumps over the lazy dog.

<p class="not-italic ...">The quick brown fox ...</p>

Prefix a font-style utility with a breakpoint variant like md: to only apply the utility at medium screen sizes and above:

<p class="italic md:not-italic ...">  Lorem ipsum dolor sit amet...</p>

Learn more about using variants in the variants documentation.

On this page

Build UIs that don’t suck — 5-day mini-course

5-day mini-course

Build UIs that don’t suck.

Short, tactical video lessons from the creator of Tailwind CSS, delivered directly to your inbox every day for a week.

Get the free course

Copyright © 2026 Tailwind Labs Inc.·Trademark Policy