Text truncate

Tailwind CSS Text truncate

Use responsive text truncate utilities with TW elements. A simple and quick way to truncate text.

Basic example

Use .truncate class which will cut off the excess text and replace it with an ellipsis (…) to indicate that there is more text than what is being displayed.

The longest word in any of the major English language dictionaries is pneumonoultramicroscopicsilicovolcanoconiosis.

HTML

        
            
        <p class="truncate">
          The longest word in any of the major English language dictionaries is
          <span class="font-bold"
            >pneumonoultramicroscopicsilicovolcanoconiosis</span
          >.
        </p>

Text truncate

Tailwind CSS Text truncate

Basic example

Access restricted

To view this section you must have an active PRO account

Text truncate

Tailwind CSS Text truncate

Basic example

Related resources