Ecovyst

gistfile1.txt

.overlay{
    background-cover: cover;
    background-image: linear-gradient(black, black), url(/path/to/background/image.jpg);
    background-repeat: no-repeat;
    background-blend-mode: saturation;
    clip-path: polygon(0 0, 100% 0%, 100% 85%, 50% 100%, 0% 85%);
}

.overlay::before{
    background-image: linear-gradient(76deg, rgba(0, 179, 255, 0.49), rgba(209, 255, 0, 0.73) 98%);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

.bubble{
    mask-image: url(/path/to/bubble.svg);
    mask-position: center right;
    mask-repeat: no-repeat;
    mask-size: cover;
}

.parent{
    background-image: url(/path/to/background/image.svg);
    background-position: center right;
    background-repeat: no-repeat;
    background-size: contain;
}