search

Home  >  Q&A  >  body text

How to add two linear gradient backgrounds on the same element - Tailwind Tutorial

Is it possible to add two linear backgrounds to one element in Tailwind? The following is valid CSS code:

background-image: linear-gradient(to right, #f8fafb 50%, #161616 50%),
      linear-gradient(to right, #161616 50%, #f8fafb 50%);

I tried adding it twice like this:

className = "bg-gradient-to-r from-white to-black bg-gradient-to-r from-black to-white";

There are also some combinations with [], but they don't work. Any help welcome :)

P粉561438407P粉561438407320 days ago500

reply all(1)I'll reply

  • P粉884548619

    P粉8845486192024-03-28 00:45:20

    End color Use the to-{color} utility to set the ending color of the gradient.

    reply
    0
  • Cancelreply