demo · v132

HDR Gradient Painter

Chrome 132 enables blending on 32-bit float textures (rgba32float) via the float32-blendable WebGPU feature. Previous versions could write to float32 render targets but couldn't blend multiple draw calls into the same target — critical for HDR rendering, glow effects, and accumulation buffers. Compare 8-bit vs 32-bit precision below.

Checking WebGPU float32-blendable support…
4 stops
3 passes
Canvas output

What Chrome 132 unlocks

Capabilityrgba8unormrgba16floatrgba32float (Chrome 132)
Use as render targetYesYesYes
Blend multiple draw callsYesYesYes (NEW)
Values > 1.0 (HDR headroom)No (clamped)YesYes
Subnormal precisionNoLimitedFull IEEE 754
Required feature flagnonenonefloat32-blendable
 
// Request float32-blendable feature
const adapter = await navigator.gpu.requestAdapter();
const hasF32Blend = adapter.features.has('float32-blendable');

const device = await adapter.requestDevice({
  requiredFeatures: hasF32Blend ? ['float32-blendable'] : []
});

// Create an rgba32float render target with blending enabled
const texture = device.createTexture({
  format: 'rgba32float',
  usage: GPUTextureUsage.RENDER_ATTACHMENT | GPUTextureUsage.TEXTURE_BINDING,
  size: [width, height]
});

const pipeline = device.createRenderPipeline({
  fragment: {
    targets: [{
      format: 'rgba32float',
      blend: {
        color: { srcFactor: 'src-alpha', dstFactor: 'one-minus-src-alpha', operation: 'add' },
        alpha: { srcFactor: 'one',       dstFactor: 'zero',                operation: 'add' }
      }
    }]
  }
});

see also