16
\$\begingroup\$

On Twitter, I found this screenshot of a game in development:

enter image description here

The image on top seems to be without any color limitation. But the two other pictures at the bottom have a 256 color palette.

I want to achieve a similar effect in my game (I am using OpenGL). How can I do so?

\$\endgroup\$
32
\$\begingroup\$

I am the creator of that image.

The image on the right is rendered using a color look-up texture. In the final GLSL shader, I apply the dither, then convert the RGB values into integers in the range 0<=x<40, combine them into a single index, then look up the resulting color value in this image:

color look up table

The lowest row is the raw palette.

The image to the left is made purely in the shader by downsampling the red and green channels to 8 values, and the blue channel to 4 values after applying the dither, resulting in RGB332. I've also played around with 7 red, 9 green and 4 blue shades, resulting in only 252 colors, but with a bigger emphasis on green, which the human eye is the most sensitive to.

\$\endgroup\$
6
\$\begingroup\$

You could use a color grading lookup table in a postprocessing step as described here and probably here.

enter image description here

After you've implemented this, all you'll have to do is make a screenshot, overlay the lookup texture ontop of it, then edit it in arbitrary graphics software until you like it - and then retrieve the modified lookup texture again. This may or may not include reducing the retrieved lookup table to a subset of colors.

When loading the lookup texture with color limitation in mind, just make sure to disable all filtering, so it won't produce additional colors.

\$\endgroup\$

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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