remotion-dev/remotion · error · Error

Failed to create color correction vertex buffer

Error message

Failed to create color correction vertex buffer

What it means

Thrown by setupColorCorrection when gl.createBuffer() returns null after the VAO was created. The GL context cannot allocate a vertex buffer object, indicating resource/memory exhaustion or context loss. Without the VBO the fullscreen-quad vertex data cannot be uploaded, so setup aborts.

Source

Thrown at packages/effects/src/color-correction.ts:389

		premultipliedAlpha: true,
		alpha: true,
		preserveDrawingBuffer: true,
	});
	if (!gl) {
		throw createWebGL2ContextError('color correction effect');
	}

	gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, true);

	const program = createProgram(gl);
	const vao = gl.createVertexArray();
	if (!vao) {
		throw new Error('Failed to create color correction vertex array');
	}

	const vbo = gl.createBuffer();
	if (!vbo) {
		throw new Error('Failed to create color correction vertex buffer');
	}

	gl.bindVertexArray(vao);
	gl.bindBuffer(gl.ARRAY_BUFFER, vbo);
	gl.bufferData(
		gl.ARRAY_BUFFER,
		new Float32Array([-1, -1, 0, 0, 1, -1, 1, 0, -1, 1, 0, 1, 1, 1, 1, 1]),
		gl.STATIC_DRAW,
	);

	const aPos = gl.getAttribLocation(program, 'aPos');
	const aUv = gl.getAttribLocation(program, 'aUv');
	gl.enableVertexAttribArray(aPos);
	gl.vertexAttribPointer(aPos, 2, gl.FLOAT, false, 16, 0);
	gl.enableVertexAttribArray(aUv);
	gl.vertexAttribPointer(aUv, 2, gl.FLOAT, false, 16, 8);
	gl.bindVertexArray(null);

View on GitHub (pinned to 78fe4bb3fd)

Solutions

1. Reduce render concurrency so fewer GL buffers are live.
2. Use a GPU-enabled render environment instead of software GL.
3. Update drivers/Chrome and retry for transient context loss.
4. Fewer stacked WebGL effects per render lowers buffer allocation.

Example fix

// before
remotion render main --concurrency=8

// after
remotion render main --concurrency=1

function webgl2BufferAvailable(): boolean {
  try {
    const c = document.createElement('canvas');
    const gl = c.getContext('webgl2');
    if (!gl) return false;
    const b = gl.createBuffer();
    const ok = b !== null;
    if (b) gl.deleteBuffer(b);
    return ok;
  } catch {
    return false;
  }
}

try {
  await renderMedia({...});
} catch (err) {
  if (/Failed to create color correction vertex buffer/i.test(String(err))) {
    await renderMedia({...opts, concurrency: 1});
  } else {
    throw err;
  }
}

When it happens

Trigger: At color-correction.ts:389 inside setupColorCorrection, after the VAO is created and bound. gl.createBuffer() returns null under GL object/memory pressure or a lost context; not parameter-driven.

Common situations: High render concurrency, software GL with low buffer limits, GPU memory pressure, or context loss during a long render.

Related errors

• Failed to create color correction shader
• Failed to create color correction shader program
• Failed to create color correction texture
• Failed to create color correction vertex array
• Failed to create WebGL buffer

AI-assisted analysis of remotion-dev/remotion@78fe4bb3fd (2026-08-12). Data as JSON: /api/errors/515156ed719aa65b. Report an issue: GitHub.