diff --git a/docs/api/en/materials/MeshPhysicalMaterial.html b/docs/api/en/materials/MeshPhysicalMaterial.html
index eae40c0e3ccf4d..b8099aad156c67 100644
--- a/docs/api/en/materials/MeshPhysicalMaterial.html
+++ b/docs/api/en/materials/MeshPhysicalMaterial.html
@@ -61,7 +61,6 @@ <h2>Examples</h2>
 			[example:webgl_materials_variations_physical materials / variations / physical]<br />
 			[example:webgl_materials_physical_clearcoat materials / physical / clearcoat]<br />
 			[example:webgl_materials_physical_reflectivity materials / physical / reflectivity]<br />
-			[example:webgl_materials_physical_sheen materials / physical / sheen]<br />
 			[example:webgl_materials_physical_transmission materials / physical / transmission]
 		</p>
 
diff --git a/docs/api/zh/materials/MeshPhysicalMaterial.html b/docs/api/zh/materials/MeshPhysicalMaterial.html
index b360eeea8095a2..49511c412d76e9 100644
--- a/docs/api/zh/materials/MeshPhysicalMaterial.html
+++ b/docs/api/zh/materials/MeshPhysicalMaterial.html
@@ -62,7 +62,6 @@ <h2>例子</h2>
 			[example:webgl_materials_variations_physical materials / variations / physical]<br />
 			[example:webgl_materials_physical_clearcoat materials / physical / clearcoat]<br />
 			[example:webgl_materials_physical_reflectivity materials / physical / reflectivity]<br />
-			[example:webgl_materials_physical_sheen materials / physical / sheen]<br />
 			[example:webgl_materials_physical_transmission materials / physical / transmission]
 		</p>
 
diff --git a/examples/files.json b/examples/files.json
index 5c3cc6c2543b46..a803fa908f8a4d 100644
--- a/examples/files.json
+++ b/examples/files.json
@@ -84,6 +84,7 @@
 		"webgl_loader_gcode",
 		"webgl_loader_gltf",
 		"webgl_loader_gltf_compressed",
+		"webgl_loader_gltf_sheen",
 		"webgl_loader_gltf_transmission",
 		"webgl_loader_gltf_variants",
 		"webgl_loader_ifc",
@@ -146,7 +147,6 @@
 		"webgl_materials_normalmap_object_space",
 		"webgl_materials_physical_clearcoat",
 		"webgl_materials_physical_reflectivity",
-		"webgl_materials_physical_sheen",
 		"webgl_materials_physical_transmission",
 		"webgl_materials_standard",
 		"webgl_materials_subsurface_scattering",
diff --git a/examples/jsm/loaders/GLTFLoader.js b/examples/jsm/loaders/GLTFLoader.js
index 3e95e5391d5bf3..de743b8bf96c13 100644
--- a/examples/jsm/loaders/GLTFLoader.js
+++ b/examples/jsm/loaders/GLTFLoader.js
@@ -94,6 +94,12 @@ class GLTFLoader extends Loader {
 
 		} );
 
+		this.register( function ( parser ) {
+
+			return new GLTFMaterialsSheenExtension( parser );
+
+		} );
+
 		this.register( function ( parser ) {
 
 			return new GLTFMaterialsTransmissionExtension( parser );
@@ -428,6 +434,7 @@ const EXTENSIONS = {
 	KHR_MATERIALS_CLEARCOAT: 'KHR_materials_clearcoat',
 	KHR_MATERIALS_IOR: 'KHR_materials_ior',
 	KHR_MATERIALS_PBR_SPECULAR_GLOSSINESS: 'KHR_materials_pbrSpecularGlossiness',
+	KHR_MATERIALS_SHEEN: 'KHR_materials_sheen',
 	KHR_MATERIALS_SPECULAR: 'KHR_materials_specular',
 	KHR_MATERIALS_TRANSMISSION: 'KHR_materials_transmission',
 	KHR_MATERIALS_UNLIT: 'KHR_materials_unlit',
@@ -704,6 +711,70 @@ class GLTFMaterialsClearcoatExtension {
 
 }
 
+/**
+ * Sheen Materials Extension
+ *
+ * Specification: https://github.com/KhronosGroup/glTF/tree/main/extensions/2.0/Khronos/KHR_materials_sheen
+ */
+class GLTFMaterialsSheenExtension {
+
+	constructor( parser ) {
+
+		this.parser = parser;
+		this.name = EXTENSIONS.KHR_MATERIALS_SHEEN;
+
+	}
+
+	getMaterialType( materialIndex ) {
+
+		const parser = this.parser;
+		const materialDef = parser.json.materials[ materialIndex ];
+
+		if ( ! materialDef.extensions || ! materialDef.extensions[ this.name ] ) return null;
+
+		return MeshPhysicalMaterial;
+
+	}
+
+	extendMaterialParams( materialIndex, materialParams ) {
+
+		const parser = this.parser;
+		const materialDef = parser.json.materials[ materialIndex ];
+
+		if ( ! materialDef.extensions || ! materialDef.extensions[ this.name ] ) {
+
+			return Promise.resolve();
+
+		}
+
+		const pending = [];
+
+		materialParams.sheenTint = new Color( 0, 0, 0 );
+		materialParams.sheenRoughness = 0;
+		materialParams.sheen = 1;
+
+		const extension = materialDef.extensions[ this.name ];
+
+		if ( extension.sheenColorFactor !== undefined ) {
+
+			materialParams.sheenTint.fromArray( extension.sheenColorFactor );
+
+		}
+
+		if ( extension.sheenRoughnessFactor !== undefined ) {
+
+			materialParams.sheenRoughness = extension.sheenRoughnessFactor;
+
+		}
+
+		// TODO sheenColorTexture and sheenRoughnessTexture
+
+		return Promise.all( pending );
+
+	}
+
+}
+
 /**
  * Transmission Materials Extension
  *
diff --git a/examples/models/fbx/cloth.fbx b/examples/models/fbx/cloth.fbx
deleted file mode 100644
index 91b5858c218491..00000000000000
Binary files a/examples/models/fbx/cloth.fbx and /dev/null differ
diff --git a/examples/models/gltf/SheenChair.glb b/examples/models/gltf/SheenChair.glb
new file mode 100644
index 00000000000000..b17772fdb79c56
Binary files /dev/null and b/examples/models/gltf/SheenChair.glb differ
diff --git a/examples/screenshots/webgl_loader_gltf_sheen.jpg b/examples/screenshots/webgl_loader_gltf_sheen.jpg
new file mode 100644
index 00000000000000..bbfa0e1b341a53
Binary files /dev/null and b/examples/screenshots/webgl_loader_gltf_sheen.jpg differ
diff --git a/examples/screenshots/webgl_materials_physical_sheen.jpg b/examples/screenshots/webgl_materials_physical_sheen.jpg
deleted file mode 100644
index f627b5d8ff1c63..00000000000000
Binary files a/examples/screenshots/webgl_materials_physical_sheen.jpg and /dev/null differ
diff --git a/examples/webgl_loader_gltf_sheen.html b/examples/webgl_loader_gltf_sheen.html
new file mode 100644
index 00000000000000..27d807d7a19ecd
--- /dev/null
+++ b/examples/webgl_loader_gltf_sheen.html
@@ -0,0 +1,113 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<title>three.js webgl - glTF 2.0 - transmission</title>
+		<meta charset="utf-8">
+		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
+		<link type="text/css" rel="stylesheet" href="main.css">
+	</head>
+
+	<body>
+		<div id="info">
+			<a href="https://threejs.org" target="_blank" rel="noopener">three.js</a> - GLTFLoader + <a href="https://github.com/KhronosGroup/glTF/tree/master/extensions/2.0/Khronos/KHR_materials_sheen" target="_blank" rel="noopener">KHR_materials_sheen</a> extension<br />
+			Sheen Chair from <a href="https://github.com/KhronosGroup/glTF-Sample-Models/tree/master/2.0/SheenChair" target="_blank" rel="noopener">glTF-Sample-Models</a>
+		</div>
+
+		<script type="module">
+
+			import * as THREE from '../build/three.module.js';
+
+			import { OrbitControls } from './jsm/controls/OrbitControls.js';
+			import { GLTFLoader } from './jsm/loaders/GLTFLoader.js';
+			import { RoomEnvironment } from './jsm/environments/RoomEnvironment.js';
+
+			import { GUI } from './jsm/libs/dat.gui.module.js';
+
+			let camera, scene, renderer, controls;
+
+			init();
+			animate();
+
+			function init() {
+
+				const container = document.createElement( 'div' );
+				document.body.appendChild( container );
+
+				camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 0.1, 20 );
+				camera.position.set( 0, 1, 2 );
+
+				scene = new THREE.Scene();
+
+				// model
+
+				new GLTFLoader()
+					.setPath( 'models/gltf/' )
+					.load( 'SheenChair.glb', function ( gltf ) {
+
+						scene.add( gltf.scene );
+
+						const object = gltf.scene.getObjectByName( 'SheenChair_fabric' );
+
+						const gui = new GUI();
+
+						gui.add( object.material, 'sheen', 0, 1 );
+						gui.open();
+
+					} );
+
+				renderer = new THREE.WebGLRenderer( { antialias: true } );
+				renderer.setPixelRatio( window.devicePixelRatio );
+				renderer.setSize( window.innerWidth, window.innerHeight );
+				renderer.toneMapping = THREE.ACESFilmicToneMapping;
+				renderer.toneMappingExposure = 1;
+				renderer.outputEncoding = THREE.sRGBEncoding;
+				container.appendChild( renderer.domElement );
+
+				const environment = new RoomEnvironment();
+				const pmremGenerator = new THREE.PMREMGenerator( renderer );
+
+				scene.background = new THREE.Color( 0xbbbbbb );
+				scene.environment = pmremGenerator.fromScene( environment ).texture;
+
+				controls = new OrbitControls( camera, renderer.domElement );
+				controls.enableDamping = true;
+				controls.minDistance = 1;
+				controls.maxDistance = 10;
+				controls.target.set( 0, 0.5, 0 );
+				controls.update();
+
+				window.addEventListener( 'resize', onWindowResize );
+
+			}
+
+			function onWindowResize() {
+
+				camera.aspect = window.innerWidth / window.innerHeight;
+				camera.updateProjectionMatrix();
+
+				renderer.setSize( window.innerWidth, window.innerHeight );
+
+			}
+
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				controls.update(); // required if damping enabled
+
+				render();
+
+			}
+
+			function render() {
+
+				renderer.render( scene, camera );
+
+			}
+
+		</script>
+
+	</body>
+</html>
diff --git a/examples/webgl_materials_physical_sheen.html b/examples/webgl_materials_physical_sheen.html
deleted file mode 100644
index 7b67daa2a230f8..00000000000000
--- a/examples/webgl_materials_physical_sheen.html
+++ /dev/null
@@ -1,198 +0,0 @@
-<html lang="en">
-	<head>
-		<title>Sheen demo (material property)</title>
-		<meta charset="utf-8">
-		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
-		<link type="text/css" rel="stylesheet" href="main.css">
-		<style>
-			body {
-				color: #333;
-			}
-		</style>
-	</head>
-	<body>
-		<div id="info">Sheen demo by <a href="https://github.com/DanielSturk">DanielSturk</a></div>
-		<div id="container"></div>
-
-		<script type="module">
-
-			import * as THREE from '../build/three.module.js';
-
-			import * as Nodes from './jsm/nodes/Nodes.js';
-
-			import Stats from './jsm/libs/stats.module.js';
-			import { GUI } from './jsm/libs/dat.gui.module.js';
-
-			import { OrbitControls } from './jsm/controls/OrbitControls.js';
-
-			import { FBXLoader } from './jsm/loaders/FBXLoader.js';
-
-			// Graphics variables
-			let camera, controls, scene, renderer, stats;
-			let directionalLight;
-			let mesh, sphere, material, nodeMaterial;
-
-			const params = {
-				nodeMaterial: true,
-				color: new THREE.Color( 255, 0, 127 ),
-				sheenBRDF: true,
-				sheen: new THREE.Color( 10, 10, 10 ), // corresponds to .04 reflectance
-				roughness: 0.9
-			};
-
-			// model
-			new FBXLoader().load( 'models/fbx/cloth.fbx', function ( loadedModel ) {
-
-				mesh = loadedModel.children[ 0 ];
-
-				init();
-
-			} );
-
-			function init( ) {
-
-				camera = new THREE.PerspectiveCamera( 60, window.innerWidth / window.innerHeight, 0.2, 2000 );
-
-				scene = new THREE.Scene();
-				scene.background = new THREE.Color( 0xbfd1e5 );
-
-				mesh.scale.multiplyScalar( 0.5 );
-				scene.add( mesh );
-
-				//
-
-				material = new THREE.MeshPhysicalMaterial();
-				material.side = THREE.DoubleSide;
-				material.metalness = 0;
-
-				//
-
-				nodeMaterial = new Nodes.StandardNodeMaterial();
-				nodeMaterial.side = THREE.DoubleSide;
-				nodeMaterial.metalness = new Nodes.FloatNode( 0 );
-				nodeMaterial.roughness = new Nodes.FloatNode();
-				nodeMaterial.color = new Nodes.ColorNode( params.color.clone() );
-
-				//
-
-				sphere = new THREE.Mesh(
-					new THREE.SphereGeometry( 1, 100, 100 ),
-					material
-				);
-				scene.add( sphere );
-
-				camera.position.set( - 12, 7, 4 );
-
-				const container = document.getElementById( 'container' );
-				renderer = new THREE.WebGLRenderer();
-				renderer.setPixelRatio( window.devicePixelRatio );
-				renderer.setSize( window.innerWidth, window.innerHeight );
-				renderer.shadowMap.enabled = true;
-				container.appendChild( renderer.domElement );
-
-				controls = new OrbitControls( camera, renderer.domElement );
-				controls.target.set( 0, 2, 0 );
-				controls.update();
-
-				directionalLight = new THREE.DirectionalLight( 0xffffff, 0.5 );
-				directionalLight.position.set( 0, 10, 0 );
-				directionalLight.castShadow = true;
-				directionalLight.add(
-					new THREE.Mesh(
-						new THREE.SphereGeometry( 0.5 ),
-						new THREE.MeshBasicMaterial( { color: 0xffffff } )
-					)
-				);
-
-				scene.add( directionalLight );
-
-				stats = new Stats();
-				stats.domElement.style.position = 'absolute';
-				stats.domElement.style.top = '0px';
-				container.appendChild( stats.dom );
-
-				window.addEventListener( 'resize', onWindowResize );
-
-				const gui = new GUI();
-
-				function onUpdate() {
-
-					mesh.material = sphere.material = params.nodeMaterial
-						? nodeMaterial
-						: material;
-
-					material.sheen = params.sheenBRDF
-						? new THREE.Color()
-						: null;
-
-					material.needsUpdate = true;
-
-					nodeMaterial.sheen = params.sheenBRDF
-						? new Nodes.ColorNode( material.sheen )
-						: undefined;
-
-					nodeMaterial.needsCompile = true;
-
-				}
-
-				gui.add( params, 'nodeMaterial' ).onChange( onUpdate );
-				gui.addColor( params, 'color' );
-				gui.add( params, 'sheenBRDF' ).onChange( onUpdate );
-				gui.addColor( params, 'sheen' );
-				gui.add( params, 'roughness', 0, 1 );
-				gui.open();
-
-				onUpdate();
-
-				animate();
-
-			}
-
-			function onWindowResize() {
-
-				camera.aspect = window.innerWidth / window.innerHeight;
-				camera.updateProjectionMatrix();
-
-				renderer.setSize( window.innerWidth, window.innerHeight );
-
-			}
-
-			function animate() {
-
-				requestAnimationFrame( animate );
-
-				render();
-				stats.update();
-
-			}
-
-			function render() {
-
-				//
-
-				material.color.copy( params.color ).multiplyScalar( 1 / 255 );
-				material.roughness = params.roughness;
-
-				//
-
-				nodeMaterial.color.value.copy( material.color );
-				nodeMaterial.roughness.value = params.roughness;
-
-				//
-
-				if ( params.sheenBRDF ) {
-
-					material.sheen.copy( params.sheen ).multiplyScalar( 1 / 255 );
-
-				}
-
-				//
-
-				renderer.render( scene, camera );
-
-			}
-
-		</script>
-
-	</body>
-</html>