Pixel art at full speed.

#version 300 es
precision mediump float;
in vec2 vTexCoord;
uniform sampler2D uInputTex;
uniform vec2 uResolution;
uniform vec4 uEmber;
uniform float uBurn;
out vec4 FragColor;

const vec3 WHITE_HOT = vec3(1.0, 0.95, 0.7);

// A random number for each pixel.
float noise(vec2 p) {
  return fract(sin(dot(p, vec2(12.9, 78.2))) * 43758.5);
}

void main() {
  vec4 c = texture(uInputTex, vTexCoord);
  vec2 pixel = floor(vTexCoord * uResolution);

  // Burns up from the feet, ragged pixel by pixel.
  float up = 1.0 - vTexCoord.y;
  float t = up * 0.75 + noise(pixel) * 0.25;
  float fire = t - (uBurn * 1.4 - 0.2);

  if (fire < 0.0) {
    // Ash, with a few embers still glowing.
    float spark = noise(pixel + floor(uBurn * 30.0));
    bool ember = fire > -0.15 && spark > 0.9;
    c = ember ? vec4(uEmber.rgb, c.a) : vec4(0.0);
  } else if (fire < 0.06) {
    // The flames: white-hot, cooling to ember.
    c.rgb = mix(WHITE_HOT, uEmber.rgb, fire / 0.06);
  } else if (fire < 0.2) {
    // Heat glowing ahead of them.
    float k = (fire - 0.06) / 0.14;
    c.rgb = mix(uEmber.rgb * 0.6, c.rgb, k);
  }
  FragColor = c;
}

{
  "id": "burn",
  "name": "Burn",
  "parameters": [
    { "id": "burn", "type": "float",
      "default": 0.5, "min": 0, "max": 1 },
    { "id": "ember", "type": "color",
      "default": "#FF7A1A" }
  ],
  "passes": [{
    "shader": "burn.frag",
    "uniforms": { "uBurn": "$burn",
                  "uEmber": "$ember" }
  }]
}