How to swap out RGB colors of a sprite using ShaderGraph? (Like in Among Us)

So I have noticed that the player sprites in Among Us use red, green and blue colors and somehow change them with the player color. As someone who has just gotten into shaders because of this specific reason, I really want to know how to achieve a clear output.
169999-idle.png
The original sprite


##I’ve tried 2 ways to change the colors.##
(3 is an adjustment on shader 2)

1) First I tried using the Replace Color Node but that caused some pixel inaccuracies and a non-filtered image. The image looks pixelated. I don’t know a way to make it look smoother so if there’s one, please let me know. When looking at them here, it might look OK but in the game it’s really noticable.
NOTE: The reason for the outlined shadow is because of an unnecessary calculation I did, I fixed it now.
Edit: Using this method, it’s also impossible to choose every single color because sometimes the chosen color gets replaced by the shader so that’s kind of unfortunate.


2) Then by seperating the RGB channels and multiplying them with the respective colors, I got this smooth image. However, since I change the overall RGB value, the white/gray parts seem to also change color, whereas they should remain white/gray.


3) And for the 3rd image; I added the RGB values together BEFORE changing colors and multiplied the result with the 2nd image’s result. This fixed the white part on the head/helmet but the shadow remains colored. It’s also obvious that some color values have changed to be darker.




I’m a bit curious on getting a clear result since this method of using red, green, blue and changing them via shader is an absolute time saver. Since this is the actual sprite used in the game, I’m not able to change it. I just want to know how it was achieved. Any help would be most appreciated.

I am not the best at dealing with the shader graph but, I may be able to help you with this dilemma…

Since you already have a good system with number 3, you could have the character be on a different sprite than the shadow, thus keeping the shadow the same colour. Then have the shadow follow the character, this could be useful with animations to where you don’t have to worry about the updating the shadow every frame used.

Like I did say, I don’t know much about unity’s shader system and there may be way better options than the way I said. Hopefully, you have found some use in what I had to say.

Welp, I guess I found something. For anyone wondering, I went with the Replace Color Node. At first I’ve tried increasing the “range” parameter and left “fuzziness” at 0. Now I tried increasing fuzziness and leaving range mostly same, I got a nice result. It has few unchanged pixels but they’re not noticable from a distance.


EDIT: It looks really bad with different colors and so I have to choose every bleeding color and change them to whatever the value should be. Which, obviously is not how I’m supposed to do it.

Hooray! i found a neat way to make it work just perfectly. So I’ve used the 2nd shader I mentioned above. Basically, it uses the Red, Green and Blue channels individually. Then, it uses a Multiply Node to multiply each channel with the desired colors. Lastly, it adds them together and gives the result. However, doing ONLY this makes the white/gray parts of the image also change color. You might want to keep some colors as they are.


So here’s the solution I came up with. First, get the channels which include the color you want to keep. Then, use a Color Mask Node to get the specific part you want to keep. Do this multiple times if you have multiple colors and add the results together. Next up, you want to subtract the masked colors from each R/G/B channel BEFORE coloring them. This makes sure that you don’t color the masked parts. Then, add the RGB channels together as usual. Last, add the masked colors to the result. This should hopefully give a clean result. I can post an image of the shader graph if anyone is interested, but it looks like spaghetti so… yeah. Though I’m sure it’s easy to understand. I’m quite a beginner so this is definitely not the most efficient code but it does the job. Also, it works with different sprites/animations as well since it’s a shader.

Hey I need your help so I have changed the player sprite to my player in game but now since their is a shader In game that forces you to use a color you pick my sprite color look weird so if I choose green then my sprite will look green. I’m wondering is their a way I can just remove the shader or replace one do the shader colors to just plain ??

Will you give me the image of what your solved one looks like?

If you prefer to use code then use something like this

float allChannels = In.r+In.b+In.g;
float mask=min(min(In.b,In.g),allChannels);
float brightMask = In.r-mask;
float shadowMask = In.b-mask;
float visorMask = In.g-mask;

float4 result;
result += brightMask * Bright_Color;
result += shadowMask * Shadow_Color;
result += visorMask * Visor_Color;
result += mask;
result.a = In.a;

return result;