remotion-dev/remotion · error · Error

Failed to create WebGL shader

Error message

Failed to create WebGL shader

What it means

Thrown by the emboss effect's compileShader() when gl.createShader(type) returns null. The WebGL2 context was acquired (createWebGL2ContextError would have thrown at setupEmboss otherwise), so a null shader means the driver could not allocate a shader object, per spec indicating a lost context or resource exhaustion.

Source

Thrown at packages/effects/src/emboss.ts:268

		1.0
	);

	vec3 rgb = texColor.rgb / alpha;
	vec3 shaded = clamp(rgb + bevel + plateau - edge * 0.035 * uDepth, 0.0, 1.0);
	rgb = mix(rgb, shaded, uAmount);

	fragColor = vec4(rgb * alpha, alpha);
}
`;

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(`Emboss shader compile failed: ${log ?? '(no log)'}`);
	}

	return shader;
};

const linkProgram = (
	gl: WebGL2RenderingContext,
	vs: WebGLShader,
	fs: WebGLShader,
): WebGLProgram => {

View on GitHub (pinned to 78fe4bb3fd)

Solutions

  1. Render with a software WebGL backend: `npx remotion render <comp> --gl=swiftshader`.
  2. Enable hardware acceleration for local preview, or preview on a machine with a working GPU.
  3. Lower render concurrency to reduce simultaneous WebGL context load.
  4. Update the Chromium build / GPU driver.
Defensive patterns

Strategy: try-catch

Try / catch

async function safeRender(opts) {
  try {
    return await renderMedia(opts);
  } catch (err) {
    if (/Failed to create WebGL shader/.test(String(err?.message ?? ''))) {
      return await renderMedia({...opts, gl: 'swiftshader'});
    }
    throw err;
  }
}

Prevention

When it happens

Trigger: Rendering or previewing emboss() on a Chrome GPU process that is unavailable, has crashed, or has exhausted its shader-object budget during setupEmboss().

Common situations: Headless/CI Chrome with no GPU, hardware acceleration disabled, many concurrent GPU-effect renders exhausting WebGL objects, or a driver reset mid-render.

Related errors


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