1

I wanna make something like this

enter image description here

I have made the shape with clip path and stacked component, what I have achieved is like this with this code

<div className="relative w-full lg:h-[220px] 2xl:h-80">
                  <div className="absolute w-full lg:h-[220px] 2xl:h-80 bg-[#2f3030] mt-10 p-3 [clip-path:polygon(0_0,65%_0,71%_18%,100%_18%,100%_100%,0_100%)]"></div>

                  <div className="absolute w-full right-0 top-0 bg-[#ff0000] lg:h-[220px] mt-10 2xl:h-80 [clip-path:polygon(67%_0,100%_0,100%_15%,72%_15%)]"></div>
                </div>

enter image description here

but the problem is, how can I make it rounded and add some gradient border like in the first image?

Rifky
  • 53
  • 6

0 Answers0