diff --git a/examples/screenshots/webgl_loader_texture_dds.jpg b/examples/screenshots/webgl_loader_texture_dds.jpg
index 785a7952a0c293..35fdc050432d2f 100644
Binary files a/examples/screenshots/webgl_loader_texture_dds.jpg and b/examples/screenshots/webgl_loader_texture_dds.jpg differ
diff --git a/examples/screenshots/webgl_materials_blending.jpg b/examples/screenshots/webgl_materials_blending.jpg
index 20a5bbf341bc05..8984df024325a6 100644
Binary files a/examples/screenshots/webgl_materials_blending.jpg and b/examples/screenshots/webgl_materials_blending.jpg differ
diff --git a/src/renderers/shaders/ShaderChunk/opaque_fragment.glsl.js b/src/renderers/shaders/ShaderChunk/opaque_fragment.glsl.js
index 07fb7207a8665b..5910b07692a42c 100644
--- a/src/renderers/shaders/ShaderChunk/opaque_fragment.glsl.js
+++ b/src/renderers/shaders/ShaderChunk/opaque_fragment.glsl.js
@@ -7,5 +7,13 @@ diffuseColor.a = 1.0;
 diffuseColor.a *= material.transmissionAlpha;
 #endif
 
-gl_FragColor = vec4( outgoingLight, diffuseColor.a );
+#ifdef BLENDING_ADDITIVE
+
+	gl_FragColor = vec4( outgoingLight * diffuseColor.a, 1.0 );
+
+#else
+
+	gl_FragColor = vec4( outgoingLight, diffuseColor.a );
+
+#endif
 `;
diff --git a/src/renderers/webgl/WebGLProgram.js b/src/renderers/webgl/WebGLProgram.js
index 679ad2ac7b6f7a..d201fed68a0a4d 100644
--- a/src/renderers/webgl/WebGLProgram.js
+++ b/src/renderers/webgl/WebGLProgram.js
@@ -830,6 +830,7 @@ function WebGLProgram( renderer, cacheKey, parameters, bindingStates ) {
 
 			parameters.dithering ? '#define DITHERING' : '',
 			parameters.opaque ? '#define OPAQUE' : '',
+			parameters.blendingAdditive ? '#define BLENDING_ADDITIVE' : '',
 
 			ShaderChunk[ 'colorspace_pars_fragment' ], // this code is required here because it is used by the various encoding/decoding function defined below
 			getTexelEncodingFunction( 'linearToOutputTexel', parameters.outputColorSpace ),
diff --git a/src/renderers/webgl/WebGLPrograms.js b/src/renderers/webgl/WebGLPrograms.js
index e632c5b765f0cc..98c1b237c642ac 100644
--- a/src/renderers/webgl/WebGLPrograms.js
+++ b/src/renderers/webgl/WebGLPrograms.js
@@ -1,4 +1,4 @@
-import { BackSide, DoubleSide, CubeUVReflectionMapping, ObjectSpaceNormalMap, TangentSpaceNormalMap, NoToneMapping, NormalBlending, LinearSRGBColorSpace, SRGBTransfer } from '../../constants.js';
+import { BackSide, DoubleSide, CubeUVReflectionMapping, ObjectSpaceNormalMap, TangentSpaceNormalMap, NoToneMapping, NormalBlending, AdditiveBlending, LinearSRGBColorSpace, SRGBTransfer } from '../../constants.js';
 import { Layers } from '../../core/Layers.js';
 import { WebGLProgram } from './WebGLProgram.js';
 import { WebGLShaderCache } from './WebGLShaderCache.js';
@@ -250,6 +250,7 @@ function WebGLPrograms( renderer, cubemaps, cubeuvmaps, extensions, capabilities
 			gradientMap: HAS_GRADIENTMAP,
 
 			opaque: material.transparent === false && material.blending === NormalBlending && material.alphaToCoverage === false,
+			blendingAdditive: material.transparent === true && material.blending === AdditiveBlending,
 
 			alphaMap: HAS_ALPHAMAP,
 			alphaTest: HAS_ALPHATEST,
@@ -566,6 +567,8 @@ function WebGLPrograms( renderer, cubemaps, cubeuvmaps, extensions, capabilities
 			_programLayers.enable( 20 );
 		if ( parameters.alphaToCoverage )
 			_programLayers.enable( 21 );
+		if ( parameters.blendingAdditive )
+			_programLayers.enable( 22 );
 
 		array.push( _programLayers.mask );