Tailwind CSS now with built-in support for background gradients

News

August 18th, 2020

tailwind17.jpg

Tailwind v1.7.0 is now released and it includes built-in support for background gradients, new background-clip utilities, new gap utility aliases, and more!

The big feature is back gradients and it will allow you to do things like this:

1<div class="bg-gradient-to-r from-orange-400 via-red-500 to-pink-500">
2 <!-- ... -->
3</div>

You can combine this new gradient feature with the new background-clip utilities to do things like this:

1<h1 class="text-6xl font-bold">
2 <span class="bg-clip-text text-transparent bg-gradient-to-r from-teal-400 to-blue-500">
3 Greetings from Tailwind v1.7.
4 </span>
5</h1>

These are just some of the highlights of the new release and their announcement covers all the new features, deprecations, and new experimental features.

Filed in:

Eric L. Barnes

Eric is the creator of Laravel News and has been covering Laravel since 2012.