1

I have several RGB images in a game that are used as "references" to create other images. Below there are three examples of references: "R-male.png", "Fish.png", "Arrows.png". For each mask, I show three result images with altered colors.

I found out that RGB are replaced with specific colors. For instance, the green is replaced with "bronze", "silver" and "gold", while the blue is replaced with "red" in the "R-male.png" and with "pink" in the "Arrows.png".

How can I do that?

First: Is that a way to compare each result image with the reference and found out exactly what is the color code for "bronze", "silver", "gold", "pink" and "red"?

Second: With the right color codes, how can I use photoshop, Python or other tool to transform the reference exactly in those images?

My maks Original Bronze Silver Gold

Improve this question
7
  • I'm not sure you're using the term "mask" correctly. I could absolutely be wrong though. I don't make games. A "mask" generally as no color it's a 1 color (black) image with a "hole" in a specific shape. Underlying colors show through the hole in the mask. The mask isn't colored.
    – Scott
    Jul 1, 2022 at 16:30
  • I changed to "reference image"
    – Luiz Fernando Puttow Southier
    Jul 1, 2022 at 16:55
  • i suspect the posted image of the templates is not the original format (it may have been indexed color or there has been a color change) For games, it is common to create art with indexed or unmixed colors so that the color itself is a mask. In any event, the Red channel looks to be a full-silhuoette mask; the green channel looks like it ought to be a mask for the blue color; the blue channel looks like it ought to be a mask for the green color, but again, there may have been a color shift which has polluted the channels. In other words, this is not meant to be interpreted as RGB image.
    – Yorik
    Jul 1, 2022 at 18:44
  • 1
    but rather it is a three alpha channels masquerading as an RGB image. This is so an image compositing routine or shader can use the masks and create three assets programmatically.
    – Yorik
    Jul 1, 2022 at 18:46
  • @yorik, you are totally right. Can you please point it out how can I do that with Photoshop?
    – Luiz Fernando Puttow Southier
    Jul 1, 2022 at 19:36

2 Answers 2

Reset to default
0

In Photoshop you can insert Adjustment layers where a layer mask limits the effect to the wanted area. In the next example my layer mask is a rectangle which allows only the leftmost column of your attached image to be affected:

enter image description here

I have 2 adjustment layers with the same mask. The masks cold as well be different. On the top the Curves layer is used to increase contrast. The Hue/Saturatin layer changes colors. There's used also the color selectivity property of the Hue/Saturation layer. Green is turned to low saturation cyan and blue is torned to orange. A narrow hue range can be selected by color without making a selection or layer mask. BTW. aselection can be turned to a layer mask and vice versa.

ADD: The questioner asked a way to recolorize to a specific RGB color - to change a certain color to another predefined color.

Answer: In that case color selective Hue/Saturation becomes difficult because the dialog is designed for inputting the change. Calculating the needed changes is impractical, but definitely possible.

Indexed color mode images could get absolute recoloring via color palette edits and that could be programmed as scripts. Unfortunately my programming knowledge isn't deep enough to show it. In addition you cannot really have those obvious gradients in indexed mode (=too many colors). Maybe a better idea is to get the original high resolution multilayer or vector images.

Improve this answer
5
  • ok, so How Can I recolor to a specific RGB color?
    – Luiz Fernando Puttow Southier
    Jul 1, 2022 at 17:12
  • Seemingly the shown adjustments are useless for you. I added a hint of the better way to the answer. Sorry for wasting your time.
    – user82991
    Jul 1, 2022 at 17:41
  • @Luiz - you can't really. Do you have the original artwork? This looks like vector work. If you have access to the originals it would be easy to change the colours, just change the stroke and gradient fills.
    – Billy Kerr
    Jul 1, 2022 at 17:42
  • It is not vector. The game uses the "reference" image, separates its channels and recolors R, G and B.
    – Luiz Fernando Puttow Southier
    Jul 1, 2022 at 19:38
  • It is like @Yorik says: three alpha channels masquerading as an RGB image. How can I use image compositing routine or shader with the masks to create the three assets programmatically?
    – Luiz Fernando Puttow Southier
    Jul 1, 2022 at 19:40
0

I really wouldn't use Photoshop for work like this. Better to use vector software, then you can easily change strokes, fills and gradient stops by simply inputting new RGB hex codes.

Here's an example. For this I recreated something similar to the fish shape in your image. I did this in Inkscape, but you could use almost any vector software, such a Adobe Illustrator, CorelDraw, maybe even Figma. This shows how you can edit the stops of a gradient by inputing the RGB hex code. You can also do the same with strokes and fills.

enter image description here

Improve this answer
2
  • Thanks for you answer. But Since I have thousands of images like this, and the game uses the "reference" png as a three alpha channels masquerading as an RGB image, I'd like to use an image compositing routine or shader with the masks and create the three assets programmatically.
    – Luiz Fernando Puttow Southier
    Jul 1, 2022 at 19:41
  • @LuizFernandoPuttowSouthier you get this kind of answers since you are asking how to do this in photoshop. If you want a different result you should define how your shader would work for people to know how to make the image asset. And then realize you are in the wrong place to ask such a thing.
    – joojaa
    Jul 3, 2022 at 3:16

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.