You can achieve this to a limited extent by using the Rotation Angle feature when you draw a Shape on the page.
However, Bubble doesn’t handle creating objects like this very well because the “overflow” isn’t hidden. (ie. you’ve only tilted a rectangle. So it’s not quite a triangle. You could do some fancy hiding in groups, but that’s unnecessary effort and isn’t well suited for responsiveness).
I recommend drawing the object in a tool like Pixlr, saving it as a transparent PNG and then dropping the image on the page.
I use Inkscape, an advanced drawing tool which is free. Inkscape can save your drawings as SVGs, which Pixlr can’t. How bubble handles PNGs isn’t the best, that is why you should upload your images as SVGs.
The problem is that the image needs to be responsive to the size of the website. The rest of the content in the website will adapt to the size of the screen, therefore the background image can’t stay the same. If I make it in Inkscape I will have to set a certain amount f pixels as with and hight.
is there any solution for making that background shape responsive?
As well, instead of drawing an image element on the page, draw a group and make the background style an image (where the image is the PNG/SVG you created). That way, you can use the group as a container and have element interact within that.
It may require a bit of tinkering to get the responsiveness right. But such is life when designing for responsiveness.