Tailwind CSS now with built-in support for background gradients

Tailwind CSS now with built-in support for background gradients

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:

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

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

<h1 class="text-6xl font-bold">
  <span class="bg-clip-text text-transparent bg-gradient-to-r from-teal-400 to-blue-500">
    Greetings from Tailwind v1.7.
  </span>
</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: News / tailwind

Newsletter

Join 31,000+ others and never miss out on new tips, tutorials, and more.

Laravel News Partners

Laravel Jobs

Senior Laravel Developer
Remote
FPV Exchange
Senior Full-Stack Developer
Remote, USA Only
Givebutter
Senior PHP Developer
Cary, NC
INE
Backend PHP Developer
Hamburg
ABOUT YOU GmbH
Engineering Director
Vancouver or remote (EST/PST preferred)
Engine Digital