mrdoob/three.js · error · Error

THREE.WebGLTextures: Unknown depthTexture format.

Error message

THREE.WebGLTextures: Unknown depthTexture format.

What it means

Thrown by WebGLTextures (setupDepthRenderbuffer / depth attachment path) when a depth texture's format does not match any of the recognized depth/stencil formats. The renderer switches attachment type (DEPTH_ATTACHMENT, DEPTH_STENCIL_ATTACHMENT, etc.) based on format; an unhandled format means it cannot choose the correct GL attachment point.

Source

Thrown at src/renderers/webgl/WebGLTextures.js:1861

				_gl.framebufferTexture2D( _gl.FRAMEBUFFER, glAttachmentType, glTextureType, webglDepthTexture, 0 );

			}

		} else if ( renderTarget.depthTexture.format === DepthStencilFormat ) {

			if ( useMultisampledRTT( renderTarget ) ) {

				multisampledRTTExt.framebufferTexture2DMultisampleEXT( _gl.FRAMEBUFFER, glAttachmentType, glTextureType, webglDepthTexture, 0, samples );

			} else {

				_gl.framebufferTexture2D( _gl.FRAMEBUFFER, glAttachmentType, glTextureType, webglDepthTexture, 0 );

			}

		} else {

			throw new Error( 'THREE.WebGLTextures: Unknown depthTexture format.' );

		}

	}

	// Setup GL resources for a non-texture depth buffer
	function setupDepthRenderbuffer( renderTarget ) {

		const renderTargetProperties = properties.get( renderTarget );
		const isCube = ( renderTarget.isWebGLCubeRenderTarget === true );

		// if the bound depth texture has changed
		if ( renderTargetProperties.__boundDepthTexture !== renderTarget.depthTexture ) {

			// fire the dispose event to get rid of stored state associated with the previously bound depth buffer
			const depthTexture = renderTarget.depthTexture;
			if ( renderTargetProperties.__depthDisposeCallback ) {

View on GitHub (pinned to da05705fa3)

Solutions

  1. Set the DepthTexture format to THREE.DepthFormat or THREE.DepthStencilFormat as appropriate.
  2. For packed depth+stencil use DepthStencilFormat with UnsignedInt248Type.
  3. Print `depthTexture.format` before rendering and ensure it is one of the recognized constants.
  4. If you need stencil-only, check whether your three.js version supports that path; otherwise use DepthStencilFormat.

Example fix

// before
rt.depthTexture = new THREE.DepthTexture(w, h, THREE.UnsignedIntType);
rt.depthTexture.format = THREE.RGBAFormat; // unknown depth format -> throws

// after
rt.depthTexture = new THREE.DepthTexture(w, h, THREE.UnsignedIntType);
rt.depthTexture.format = THREE.DepthFormat;
Defensive patterns

Strategy: validation

Validate before calling

const KNOWN = new Set([THREE.DepthFormat, THREE.DepthStencilFormat]);
function validateDepthFormat(depthTexture) {
  if (depthTexture && !KNOWN.has(depthTexture.format)) {
    throw new Error('Unsupported depthTexture format: ' + depthTexture.format);
  }
}

Type guard

function isKnownDepthFormat(format) {
  return format === THREE.DepthFormat || format === THREE.DepthStencilFormat;
}

Prevention

When it happens

Trigger: Setting a DepthTexture with a format that isn't DepthFormat, DepthStencilFormat, or the other handled depth formats (e.g. accidentally assigning RGBAFormat or a stencil-only format) and using it as a render target's depthTexture.

Common situations: Constructing DepthTexture with a default or wrong format. Combining a texture format constant from a non-three source. Version mismatches where a previously valid depth format constant was renamed. Mixing up the format and type arguments to DepthTexture.

Related errors


AI-assisted analysis of mrdoob/three.js@da05705fa3 (2026-08-12). Data as JSON: /api/errors/3c4c705632fc7839. Report an issue: GitHub.