remotion-dev/remotion · error · Error

Could not load the LUT sample image. Check your internet…

Error message

Could not load the LUT sample image. Check your internet connection.

What it means

Before applying the LUT, LutPreview loads a sample image via an <img> element and image.decode(). If decoding fails (network error, broken image, CORS taint), the component throws this error to explain that the preview's sample image could not be loaded.

Solutions

1. Check your internet connection — the sample image is fetched from a remote URL.
2. Open DevTools > Network and confirm the sample image request; unblock it if an extension/proxy blocks it.
3. Verify the sample image URL in LutPreview.tsx still resolves (curl -I it); update it if the host moved.
4. If offline usage is required, replace the remote sample with a locally bundled image.

try {
  const probe = new Image();
  await new Promise((res, rej) => { probe.onload = res; probe.onerror = rej; probe.src = sampleImage; });
} catch { console.warn('Sample image unreachable'); }

try {
  await image.decode();
} catch {
  // fall back to a bundled placeholder or retry once
}

When it happens

Trigger: Calling LutPreview (rendering the LUT preview UI in Studio) when the hardcoded/sample sample image URL fails: no internet connection, the image host is unreachable, or decode() rejects due to a corrupted or CORS-blocked image.

Common situations: Developing Studio behind a corporate firewall or offline; the sample image CDN is down or blocked; DNS failures in CI or sandboxed environments; ad-blockers intercepting the image request.

Related errors

• Could not load LUT (HTTP ).
• Cannot read media without a content length. This is…
• Cannot read media without it supporting the "Content-Range"…
• Combined 1D and 3D LUTs are not supported.
• Conflicting LUT input range headers.

AI-assisted analysis of remotion-dev/remotion@46a3a6bf13 (2026-09-18). Data as JSON: /api/errors/f204a67e6614719d. Report an issue: GitHub.

Appendix: source

Thrown at packages/studio/src/components/LutPreview.tsx:189

		image.crossOrigin = 'anonymous';
		setState({type: 'loading'});

		const load = async () => {
			const response = await fetch(src, {signal: controller.signal});
			if (!response.ok) {
				throw new Error(`Could not load LUT (HTTP ${response.status}).`);
			}

			const lut = parseCubeLut(await response.text());
			if (controller.signal.aborted) {
				return;
			}

			image.src = sampleImage;
			try {
				await image.decode();
			} catch {
				throw new Error(
					'Could not load the LUT sample image. Check your internet connection.',
				);
			}

			if (controller.signal.aborted) {
				return;
			}

			const before = beforeRef.current?.getContext('2d');
			const after = afterRef.current?.getContext('2d');
			if (!before || !after) {
				throw new Error('Could not create the LUT preview canvas.');
			}

			before.drawImage(image, 0, 0, previewWidth, previewHeight);
			const pixels = before.getImageData(0, 0, previewWidth, previewHeight);
			applyCubeLut(pixels.data, lut);
			after.putImageData(pixels, 0, 0);

View on GitHub (pinned to 46a3a6bf13)