Community forum for knowledge and support

Updated last year

Clipping background with flowing hero container radius

At a glance

The community member is a fan of a design style with clipped backgrounds and flowing hero background containers. They are trying to figure out how to achieve this effect in Figma and Webflow, and are seeking help and insight. The comments suggest that the effect may be achieved using SVG, and one community member provides a link to an example of "inverted border radius" as a potential solution. However, there is no explicitly marked answer in the provided information.

Useful resources

AAndre Parmar

Big fan of this design style with the clipping of the background but the hero background containers radius flows its own way. and either I don’t know the name of it or trying to piece in my head how to achieve this in figma and then webflow lol, help and insight is appreciated 😊

4 comments

JJared McKinney

Love this style. Very cool

AAndre Parmar

My guess is its a svg because i have no clue how else to do accomplish this lol, but then if so trying to figure out the best way to make it responsive

TThomas

Inverted border radius: https://codepen.io/kristen17/pen/pomgrKp

AAndre Parmar

you’re a life saver, the rabbit hole begins

Add a reply