Workit landing page

Hello, @Sazzadur.

This curvy background was really difficult to me too.

The best way I found to represent that was using a different element with the who inherit the color of his parent with width 100%. In the CSS I use the relative position to position in the bottom of the parent. The curve pattern I use this code:

.ellipsePattern {
  background-color: inherit;

  width: 100%;
  height: 4em;
  bottom: -4em;
  left: 0;

  clip-path: ellipse(60% 100% at top center); <-----
  position: relative;

This was very difficult to reach that solution because it's unusual to do such curve. You can read more about here, if you wanna try: Mozzilla docs

This function is like this ellipse ( "How curve you want relative to his own size", "Size that starts the curve" at "Position")

Hope this helps you!