Dealing with content on a moving colored background
Hello front-end friends!
Does anyone happen to have any suggestions on how to deal with content that is on top a moving colored background? - without relying on breakpoints alone.
I have this wave background, that scales with the page, meaning the high-and-low point of the wave move based on screen size. On top of the wave I have a title, and here's the problem/question: Is there a way to ensure that the text never goes invisible (white on white) when I don't know when it happens?
My first thought was to change the text color on set breakpoints, but the issue with that is that according to WCAG, users have to be able to increase text size by 200% - meaning it's not only screen size alone that makes the text fall "out" of the wave.
I know I can move the text higher up on the wave to avoid the problem completely, but the designers will love me if I figure this out
Thank you in advance for all help and suggestions!
Does anyone happen to have any suggestions on how to deal with content that is on top a moving colored background? - without relying on breakpoints alone.
I have this wave background, that scales with the page, meaning the high-and-low point of the wave move based on screen size. On top of the wave I have a title, and here's the problem/question: Is there a way to ensure that the text never goes invisible (white on white) when I don't know when it happens?
My first thought was to change the text color on set breakpoints, but the issue with that is that according to WCAG, users have to be able to increase text size by 200% - meaning it's not only screen size alone that makes the text fall "out" of the wave.
I know I can move the text higher up on the wave to avoid the problem completely, but the designers will love me if I figure this out
Thank you in advance for all help and suggestions!


