BabylonJS/Babylon.js · error · Error

All images must share the same dimensions. Image at index ${

Error message

All images must share the same dimensions. Image at index ${index} is ${bitmap.width}x${bitmap.height}, expected ${width}x${height}.

What it means

A 2D array texture requires every layer to share the same width and height. After decoding all images into ImageBitmaps, this error is thrown if any image at index > 0 differs in size from the first one.

Source

Thrown at packages/dev/core/src/Materials/Textures/rawTexture2DArray.functions.ts:265

                result.value.close();
            }
        }
        throw firstRejection.reason;
    }

    const bitmaps = results.filter((result): result is PromiseFulfilledResult<ImageBitmap> => result.status === "fulfilled").map((result) => result.value) as [
        ImageBitmap,
        ...ImageBitmap[],
    ];

    try {
        const width = bitmaps[0].width;
        const height = bitmaps[0].height;

        for (let index = 1; index < bitmaps.length; index++) {
            const bitmap = bitmaps[index];
            if (bitmap.width !== width || bitmap.height !== height) {
                throw new Error(`All images must share the same dimensions. Image at index ${index} is ${bitmap.width}x${bitmap.height}, expected ${width}x${height}.`);
            }
        }

        const texture = new RawTexture2DArray(
            null,
            width,
            height,
            bitmaps.length,
            Constants.TEXTUREFORMAT_RGBA,
            scene,
            options?.generateMipMaps ?? true,
            options?.invertY ?? false,
            options?.samplingMode,
            options?.textureType
        );

        try {
            const uploadOptions: IUploadImageToTexture2DArrayLayerOptions = {

View on GitHub (pinned to 0592b347b8)

Solutions

Resize all source images to identical dimensions before uploading (or at export time).
Request size-consistent variants from the server, or add imageBitmapOptions with resizeWidth/resizeHeight so all bitmaps are normalized.
Log each image's natural size before calling and fix the outliers in the asset pipeline.

Example fix

// before: mixed sizes pass straight through
await CreateTexture2DArrayFromImageUrlsAsync(urls, scene);
// after: normalize decode size
await CreateTexture2DArrayFromImageUrlsAsync(urls, scene, {
  imageBitmapOptions: { resizeWidth: 512, resizeHeight: 512 }
});

Defensive patterns

Strategy: validation

Validate before calling

// Normalize all images to one size via imageBitmapOptions
const options = { imageBitmapOptions: { resizeWidth: 512, resizeHeight: 512 } };
await CreateTexture2DArrayFromImageUrlsAsync(urls, scene, options);

Type guard

function allBitmapsSameSize(bitmaps: ImageBitmap[]): boolean {
  return bitmaps.every(b => b.width === bitmaps[0].width && b.height === bitmaps[0].height);
}

Try / catch

try {
  const tex = await CreateTexture2DArrayFromImageUrlsAsync(urls, scene);
} catch (e) {
  if (String(e.message).startsWith("All images must share the same dimensions")) {
    console.error("Fix the asset listed in the error index.");
  }
}

Prevention

Resize all array slice images to a fixed resolution at export time.
Decode with imageBitmapOptions resize to enforce uniformity regardless of source size.
Keep retina/non-retina variants in separate sets, never mixed in one array.

When it happens

Trigger: Calling CreateTexture2DArrayFromImageUrlsAsync (or the texture2DArray helpers that call it) with a URL list whose images have differing pixel dimensions.

Common situations: Mixing PNG slices exported at different resolutions, images resized by a build step, using a mipmap variant URL by mistake in one entry, retina vs non-retina exports mixed together.

Related errors

AI-assisted analysis of BabylonJS/Babylon.js@0592b347b8 (2026-08-30). Data as JSON: /api/errors/4080a2b34ff1d6d2. Report an issue: GitHub.