How do I change a sprite color?

:information_source: Attention Topic was automatically imported from the old Question2Answer platform.
:bust_in_silhouette: Asked By Skydome

So I would like to know how to change a sprite’s color. It’s a PNG image. I’m just starting with this game so I just started with a blue oval. I would like to change it’s color to green or red with the press of a button. How do I do that?
Does the sprite have to be white or grey for me to change it’s color? Does the sprite node have any property to change it’s color. I managed to make it black or bright blue by changing the Blend Mode options in the CanvasItemMaterial. But beyond that I couldn’t figure it out.
Any help will be appreciated.

:bust_in_silhouette: Reply From: Xrayez

You can easily change Sprite’s color by setting modulate property, either from code or editor:

 $sprite.modulate = Color(0, 0, 1) # blue shade
 $sprite.modulate = Color(1, 1, 1) # reset to default

The color palette of the sprite may be whitish/grayscale if you want your sprite to render complete color range nicely, but it’s not required. For instance, you could make different parts of your character appear in different colors.

Keep in mind that setting modulate property will change color for all children of the sprite. If you want to change only the desired sprite, you should set self_modulate property instead:

 $sprite.self_modulate = Color(0, 1, 0) # green shade, children not affected

Thank you so much! That really helped me out. I searched in several places about people asking this but never saw anything about modulate.
BTW do you mind explaining how the changing different parts of the character feature work? Modulate has so far changed the whole sprite. Or is that done through co-ordinates in the script?
Thank you again for your help :slight_smile:

Skydome | 2018-09-18 19:35

I meant to say that you can have different parts of the character as separate sprites and offset them accordingly. That way you could create cutout animation and have ability to modulate color easily on each part:

Cutout Animation

I think it’s possible to have different parts of the same sprite have different color using Light2D node or writing some canvas item shaders, but that’s a bit out of my knowledge scope.

Xrayez | 2018-09-19 08:23

Ah OK. Understood. Cutout is something I was already using so I’ll figure it out.
Thank you again.

Skydome | 2018-09-19 12:20