The default slider in Webflow has white arrows and bullets. But what if you have an image that has a white background or lighter in color? Is there a simple way to still be able to see these UI elements no matter what background they are on?
Yes… behold… the CSS filter “invert” property.
But you might wonder, well if I put the filter as invert, that will cover light and dark backgrounds. But what about grey? Wouldn’t my nav again disappear?
Yes… behold… set the the filter to 58% (or find your sweet spot).
Ok. I know that was an easy solution. But the strange thing is—no one writes about it on the net. I’ve read tons of other complicated solutions and none seem to meet all demands across the board. Anyhow, there it is. I’ve added a link below to copy code and re-purpose. Night!