A better Pixelated Fire


I was following febucci’s fire shader, and while looking to pixelate the fire, I noticed a nice pixelation effect.

How it normally looks

Adding pixelation

This line placed before any other effects adds pixelation:

uv = floor(uv * pixelSize) / pixelSize;

This isn’t adjusting for aspect ratio (which is why each pixel is wider than taller). You would adjust this by doing:

uv.x = floor(uv.x * pixelSizeX * aspect) / pixelSizeX;
uv.y = floor(uv.y * pixelSizeY) / pixelSizeX;

But by accident, I uncommented one of these lines, just leaving out the first one

uv.x = floor(uv.x * pixelSizeX * aspect) / pixelSizeX;

… resulting in the following fire:

The pixelation is happening only horizontally. Notice how smoother it is yet still retaining the spirit of pixel art.