How can I filter an image, such as change brightness or saturation?

I have some elements that I’d like to respond to game state by darkening and desaturating the image. I can’t find any equivalent to the CSS “filter” property, or anything that would let me change the appearance of an image.

How can I do change the brightness/saturation or otherwise filter an image in UI Toolkit? I don’t mind if I have to write a custom VisualElement for it.

Did you find a solution?

I did not for UI Toolkit, but using UGUI I ended up writing my own shader that allowed me to do this.

Hey! You can use an ImmediateModeElement to write your own custom shader in UI Toolkit: Unity - Scripting API: ImmediateModeElement. You just need to override ImmediateRepaint. There are some limitations though, stencil-based masking might not work properly (e.g. overflow=hidden with rounded corners).

Are there any plans to expose the immediate callback like the generateVisualContent callback?
It would eliminate the need to use inheritance.

All ImmediateModeElement does is basically register the immedate callback in generateVisualContent and wrap it up for the profiler.

Source: https://github.com/Unity-Technologies/UnityCsReference/blob/94bcde1a7e8af4cc3212d756bf59632b979517f2/Modules/UIElements/Core/ImmediateModeElement.cs#L18