I’m currently implementing with a design into Webflow and I’m trying to figure out the best way to achieve this look responsively. As you see, there’s a purple line that stems from the hero CTA button in the bottom right corner. How would I go about changing the line color when it enters the new section; purple to white?
I thought about making two separate lines, but It’s difficult to always have them line up right. I wonder if there’s some sort of masking trick?
I added a red circle to show the interlacing I’m having issues with.
The only other thing I can think of is to create an identical line in each box it will cross and line them up using absolute positioning. But from a design standpoint, I personally think it’s kind of distracting. Is there an actual reason for it?
Honestly, if it were my client, I’d tell them that they’ll be charged extra for that part of the design due to the complexity. Alternatively tell them that that part of the design is confusing on mobile and doesn’t really make design sense. As a designer, I honestly think it’s distracting and kind of pointless. Sorry I’m not more help.
. It’s their design.