diff --git a/examples/jsm/nodes/materials/NodeMaterial.js b/examples/jsm/nodes/materials/NodeMaterial.js
index 61355c4896d66f..a56c1a96761285 100644
--- a/examples/jsm/nodes/materials/NodeMaterial.js
+++ b/examples/jsm/nodes/materials/NodeMaterial.js
@@ -319,6 +319,12 @@ class NodeMaterial extends ShaderMaterial {
 
 		}
 
+		// FOG
+
+		const fogNode = builder.fogNode;
+
+		if ( fogNode ) outputNode = vec4( fogNode.mixAssign( outputNode.rgb ), outputNode.a );
+
 		// ENCODING
 
 		const renderTarget = renderer.getRenderTarget();
@@ -341,12 +347,6 @@ class NodeMaterial extends ShaderMaterial {
 
 		}
 
-		// FOG
-
-		const fogNode = builder.fogNode;
-
-		if ( fogNode ) outputNode = vec4( fogNode.mixAssign( outputNode.rgb ), outputNode.a );
-
 		return outputNode;
 
 	}
diff --git a/examples/webgpu_lights_phong.html b/examples/webgpu_lights_phong.html
index e51dd378a5fc85..d6fe0d16913db9 100644
--- a/examples/webgpu_lights_phong.html
+++ b/examples/webgpu_lights_phong.html
@@ -58,7 +58,7 @@
 				camera.position.z = 7;
 
 				scene = new THREE.Scene();
-				scene.fogNode = rangeFog( color( 0xFF00FF ), 3, 30 );
+				scene.fogNode = rangeFog( color( 0xFF00FF ), 8, 30 );
 
 				const sphereGeometry = new THREE.SphereGeometry( 0.1, 16, 8 );
 
diff --git a/examples/webgpu_lights_selective.html b/examples/webgpu_lights_selective.html
index 85b0c5284f5396..22580406edc4cf 100644
--- a/examples/webgpu_lights_selective.html
+++ b/examples/webgpu_lights_selective.html
@@ -60,7 +60,7 @@
 				camera.position.z = 7;
 
 				scene = new THREE.Scene();
-				scene.fogNode = rangeFog( color( 0xFF00FF ), 3, 30 );
+				scene.fogNode = rangeFog( color( 0xFF00FF ), 8, 30 );
 
 				const sphereGeometry = new THREE.SphereGeometry( 0.1, 16, 8 );