On a website where users can submit text posts containing images and also change various formatting aspects of the website, such as the text color, I'd like to allow them to submit images that match whatever text color the viewer has chosen.

For instance, if someone wants to include a complex mathematical formula in their post, they currently have to either use very strange notation or submit an image. Readers may not be able to see this image well or at all if they have selected certain background colors.

With the system I'm hoping to implement, someone could submit an image that's a solid color with a varying alpha channel. It would be styled with CSS to be currentColor.

Blend modes don't work because they also blend with elements behind the image. I would prefer not to complicate things by drawing with JavaScript on a canvas, because I'd have to set it up to update every time the user changes their formatting. I also can't just use JavaScript to inline an SVG because that would leave the site open to XSS attacks, and users may not want to go to the trouble of constructing an SVG file where every color is set to currentColor.

Is there a way to do this? What is it?