remotion-dev/remotion · error · Error

Color key shader compile failed: ${log ?? '(no log)'}

Error message

Color key shader compile failed: ${log ?? '(no log)'}

What it means

Thrown by compileShader in the color key effect when gl.getShaderParameter(shader, COMPILE_STATUS) is false. The bundled COLOR_KEY_VS or COLOR_KEY_FS failed to compile on the active driver; the driver info log is appended. Since the GLSL ships with the library, a compile failure usually reflects a driver/version incompatibility, not a colorKey() parameter.

Source

Thrown at packages/effects/src/color-key.ts:200

}
`;

const compileShader = (
	gl: WebGL2RenderingContext,
	type: number,
	source: string,
): WebGLShader => {
	const shader = gl.createShader(type);
	if (!shader) {
		throw new Error('Failed to create WebGL shader');
	}

	gl.shaderSource(shader, source);
	gl.compileShader(shader);
	if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
		const log = gl.getShaderInfoLog(shader);
		gl.deleteShader(shader);
		throw new Error(`Color key shader compile failed: ${log ?? '(no log)'}`);
	}

	return shader;
};

const linkProgram = (
	gl: WebGL2RenderingContext,
	vs: WebGLShader,
	fs: WebGLShader,
): WebGLProgram => {
	const program = gl.createProgram();
	if (!program) {
		throw new Error('Failed to create WebGL program');
	}

	gl.attachShader(program, vs);
	gl.attachShader(program, fs);
	gl.linkProgram(program);

View on GitHub (pinned to 78fe4bb3fd)

Solutions

1. Read the info log in the error to find the offending GLSL line/directive.
2. Update the GPU driver and/or the Chromium build used for rendering.
3. Move off software GL to a GPU-enabled render environment.
4. Report driver, Chrome version, and log to Remotion — the shader is library-controlled.

try {
  await renderMedia({...});
} catch (err) {
  const msg = String(err);
  if (/Color key shader compile failed/i.test(msg)) {
    // driver/GLSL incompatibility; surface the log and switch environments
    throw new Error(`Color-key shader rejected by driver. Log: ${msg}`);
  }
  throw err;
}

When it happens

Trigger: At color-key.ts:200 inside compileShader when the driver rejects the GLSL ES 3.00 source of the color key shaders. The info log (or '(no log)') is included; not parameter-driven.

Common situations: A GPU/driver or Chromium version that rejects a construct in the bundled shader, software GL (SwiftShader) with stricter limits, an outdated Chromium, or a degraded context.

Related errors

• Color key program link failed: ${log ?? '(no log)'}
• Color correction shader compile failed: ${log ?? '(no log)'}
• Color correction shader link failed: ${log ?? '(no log)'}
• Failed to create WebGL shader
• Checkerboard shader compile failed: ${log ?? '(no log)'}

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