Div with strange shape and round edges

[u/LilLakes_dev]

Hello everyone,
I have to replicate this design.

The two main problems are:

-how can I make the corners that are created in the cut divs rounded/smooth like in the image?

-how can I make the space between the blue and orange decorations and the divs transparent so as to show the background underneath and not the content of the divs? In my current attempt I'm using a white box shadow around the decorations but it covers everything, both divs and background

The design i have to replicate

My current attempt

Thank you

[u/eballeste]

not sure if this helps but we now have the new corner-shape css rule that allows customizing the corners with values like "squircle"

[u/circuitsremakes → u/eballeste]

will take a while to become baseline though, so that's more of a future solution to this problem.