# \#morph-targets

**URL:** https://discourse.threejs.org/tag/morph-targets/271.md

[Latest](https://discourse.threejs.org/latest.md) · [Categories](https://discourse.threejs.org/categories.md) · [Tags](https://discourse.threejs.org/tags.md)

---

## [Advanced 3D Effects: Particle Morphing](https://discourse.threejs.org/t/advanced-3d-effects-particle-morphing/88359)

<div class="topic-metadata">

**Author:** [@Parisa\_Shahbazi](https://discourse.threejs.org/u/Parisa_Shahbazi)\
**Replies:** 0\
**Last updated:** [November 30, 2025, 7:50pm UTC](https://discourse.threejs.org/t/advanced-3d-effects-particle-morphing/88359 "2025-11-30T19:50:26Z")

</div>

In this project, which has been one of the most challenging ones for me recently, I have utilized custom shaders, particles, GLSL, and Three.js to create unique visual effects. Below, I will explain the details of these …

---

## [Best approach for real-time facial morphing (nose, chin, lips) in Three.js](https://discourse.threejs.org/t/best-approach-for-real-time-facial-morphing-nose-chin-lips-in-three-js/87032)

<div class="topic-metadata">

**Author:** [@Parisa\_Shahbazi](https://discourse.threejs.org/u/Parisa_Shahbazi)\
**Replies:** 5\
**Last updated:** [September 17, 2025, 1:05pm UTC](https://discourse.threejs.org/t/best-approach-for-real-time-facial-morphing-nose-chin-lips-in-three-js/87032 "2025-09-17T13:05:00Z")

</div>

Hi everyone, I’m working on a project where we receive a 3D scan of a patient’s face (from a mobile app). We want to build a web-based tool where users can interactively change facial features — for example: Increas…

---

## [How to control a particle morph (custom shader) with mouse scroll instead of automatic animation?](https://discourse.threejs.org/t/how-to-control-a-particle-morph-custom-shader-with-mouse-scroll-instead-of-automatic-animation/86338)

<div class="topic-metadata">

**Author:** [@Parisa\_Shahbazi](https://discourse.threejs.org/u/Parisa_Shahbazi)\
**Replies:** 2\
**Last updated:** [August 18, 2025, 8:23pm UTC](https://discourse.threejs.org/t/how-to-control-a-particle-morph-custom-shader-with-mouse-scroll-instead-of-automatic-animation/86338 "2025-08-18T20:23:09Z")

</div>

I have a Three.js project where I use particles + morphing with a custom shader. Right now, the morph animation plays automatically (e.g., particles transform from a circle into an image, and from one image into another…

---

## [Morph attributes in TSL](https://discourse.threejs.org/t/morph-attributes-in-tsl/84909)

<div class="topic-metadata">

**Author:** [@Rathalio](https://discourse.threejs.org/u/Rathalio)\
**Replies:** 9\
**Last updated:** [July 8, 2025, 11:27am UTC](https://discourse.threejs.org/t/morph-attributes-in-tsl/84909 "2025-07-08T11:27:37Z")

</div>

Hi! I’m now familiar with TSL. But I’m still having issues retrieving some data for morphTargets using TSL. For regular attributes attribute('name') works. I can use it for position, normal, uv, skinIndex, skinWeight w…

---

## [How to Align Particles Along the Z-Axis for a Tunnel Effect in Three.js?](https://discourse.threejs.org/t/how-to-align-particles-along-the-z-axis-for-a-tunnel-effect-in-three-js/79933)

<div class="topic-metadata">

**Author:** [@Parisa\_Shahbazi](https://discourse.threejs.org/u/Parisa_Shahbazi)\
**Replies:** 15\
**Last updated:** [May 15, 2025, 3:54pm UTC](https://discourse.threejs.org/t/how-to-align-particles-along-the-z-axis-for-a-tunnel-effect-in-three-js/79933 "2025-05-15T15:54:33Z")

</div>

I want to create a tunnel of particles where, as I scroll, it feels like I’m traveling inside the tunnel, with some div elements appearing along the way. My main challenge is aligning the direction of the particles to m…

---

## [Ray intersection on instencedMesh that has multiple morph targets](https://discourse.threejs.org/t/ray-intersection-on-instencedmesh-that-has-multiple-morph-targets/81181)

<div class="topic-metadata">

**Author:** [@Polcsi](https://discourse.threejs.org/u/Polcsi)\
**Replies:** 1\
**Last updated:** [April 14, 2025, 5:13pm UTC](https://discourse.threejs.org/t/ray-intersection-on-instencedmesh-that-has-multiple-morph-targets/81181 "2025-04-14T17:13:10Z")

</div>

I would like to create an instancedMesh that can handle morphing. I need morph targets because each instance should have different shape so morph targets seems handy. Also each instance should detect rays because I need …

---

## [Oversized bounding boxes for example models](https://discourse.threejs.org/t/oversized-bounding-boxes-for-example-models/24029)

<div class="topic-metadata">

**Author:** [@hobzcalvin](https://discourse.threejs.org/u/hobzcalvin)\
**Replies:** 5\
**Last updated:** [March 20, 2025, 3:48am UTC](https://discourse.threejs.org/t/oversized-bounding-boxes-for-example-models/24029 "2025-03-20T03:48:08Z")

</div>

I’m not sure if this is specific to animated models or not, but I’ve only seen it with animated examples such as three.js/Horse.glb at 50380bd1b84a1c1fbd3bb7e41769c21f01f3b60f · mrdoob/three.js · GitHub and three.js/Fl…

---

## [How to crossFade two textures with shaders for morphTarget object animations?](https://discourse.threejs.org/t/how-to-crossfade-two-textures-with-shaders-for-morphtarget-object-animations/75383)

<div class="topic-metadata">

**Author:** [@marcoscarvalho](https://discourse.threejs.org/u/marcoscarvalho)\
**Replies:** 2\
**Last updated:** [December 19, 2024, 10:08pm UTC](https://discourse.threejs.org/t/how-to-crossfade-two-textures-with-shaders-for-morphtarget-object-animations/75383 "2024-12-19T22:08:30Z")

</div>

I have a very odd scenario happening here, I want making two textures working along each other, one of them will fade, while the other will come up, making a smooth transition. I made it working just fine for normal obj…

---

## [Instanced particle morph animation](https://discourse.threejs.org/t/instanced-particle-morph-animation/56777)

<div class="topic-metadata">

**Author:** [@unni\_krishnan](https://discourse.threejs.org/u/unni_krishnan)\
**Replies:** 8\
**Last updated:** [December 14, 2024, 6:27am UTC](https://discourse.threejs.org/t/instanced-particle-morph-animation/56777 "2024-12-14T06:27:14Z")

</div>

const color = new THREE.Color(); const sphereGeometry = new THREE.SphereGeometry(0.008, 16, 16); const particles = new THREE.InstancedMesh( sphereGeometry, new THREE.MeshStandardMaterial(), 8000…

---

## [Morph Targets on GLTF models](https://discourse.threejs.org/t/morph-targets-on-gltf-models/61540)

<div class="topic-metadata">

**Author:** [@raaaahman](https://discourse.threejs.org/u/raaaahman)\
**Replies:** 5\
**Last updated:** [November 30, 2024, 11:43am UTC](https://discourse.threejs.org/t/morph-targets-on-gltf-models/61540 "2024-11-30T11:43:17Z")

</div>

Hello, I am fiddling with morph targets, trying to understand what they are and how they operate. I started with the Three.JS examples, one of a simple Mesh, and one of a GTLF Model. I don’t know what’s in the GLTF mod…

---

## [GLTF Exporter unable to export animation with morph target that load using FBXLoader](https://discourse.threejs.org/t/gltf-exporter-unable-to-export-animation-with-morph-target-that-load-using-fbxloader/73047)

<div class="topic-metadata">

**Author:** [@Chatchaponz](https://discourse.threejs.org/u/Chatchaponz)\
**Replies:** 2\
**Last updated:** [November 5, 2024, 8:33am UTC](https://discourse.threejs.org/t/gltf-exporter-unable-to-export-animation-with-morph-target-that-load-using-fbxloader/73047 "2024-11-05T08:33:55Z")

</div>

Hi, I’m encounter some issue when try to export the model along with animation that load form FBXLoader It keep showing error like this Error: THREE.GLTFExporter: Morph target name not found: 0 After some investigatio…

---

## [Cannot get rid of texture stretching with morphTarget](https://discourse.threejs.org/t/cannot-get-rid-of-texture-stretching-with-morphtarget/67598)

<div class="topic-metadata">

**Author:** [@kalabedo](https://discourse.threejs.org/u/kalabedo)\
**Replies:** 1\
**Last updated:** [September 17, 2024, 3:39pm UTC](https://discourse.threejs.org/t/cannot-get-rid-of-texture-stretching-with-morphtarget/67598 "2024-09-17T15:39:21Z")

</div>

Hi there, I am trying to create a wooden Frame that can be scaled in its width and height by the user. My first approach was to cut the frame into corner parts, vertical parts and horizontal parts and position and scal…

---

## [How to use AnimationClip.CreateFromMorphTargetSequence to create animation for standard model](https://discourse.threejs.org/t/how-to-use-animationclip-createfrommorphtargetsequence-to-create-animation-for-standard-model/70573)

<div class="topic-metadata">

**Author:** [@lourd](https://discourse.threejs.org/u/lourd)\
**Replies:** 1\
**Last updated:** [September 11, 2024, 9:12pm UTC](https://discourse.threejs.org/t/how-to-use-animationclip-createfrommorphtargetsequence-to-create-animation-for-standard-model/70573 "2024-09-11T21:12:47Z")

</div>

In my application, I have a standard gltf model of a face that has a few dozen morph targets as part of the model. Users generate these models - they do not have any animations baked in. I want to animate the face to mak…

---

## [Need help with r3f + morphTargets](https://discourse.threejs.org/t/need-help-with-r3f-morphtargets/67926)

<div class="topic-metadata">

**Author:** [@kalabedo](https://discourse.threejs.org/u/kalabedo)\
**Replies:** 14\
**Last updated:** [July 10, 2024, 6:58am UTC](https://discourse.threejs.org/t/need-help-with-r3f-morphtargets/67926 "2024-07-10T06:58:09Z")

</div>

Hi there, I am trying to create a R3F component (called Door) that can have different scales defined by its prop: \<Door width={2} /\> The prop is used in the component to calculate the morphTargetValue: const meshRef …

---

## [Morph sphere to plane geometry with complex shader material](https://discourse.threejs.org/t/morph-sphere-to-plane-geometry-with-complex-shader-material/67309)

<div class="topic-metadata">

**Author:** [@Faonfable](https://discourse.threejs.org/u/Faonfable)\
**Replies:** 6\
**Last updated:** [June 28, 2024, 7:25am UTC](https://discourse.threejs.org/t/morph-sphere-to-plane-geometry-with-complex-shader-material/67309 "2024-06-28T07:25:51Z")

</div>

Hi Three Commu ! :v:t5: I try to achieve a scene in Webflow with Threejs. On one hand I made a sphere with a liquid distortion effect using fragment shader material. \<!-- Include Three.js --\> \<script src="https://cdn.…

---

## [Converting a mesh with morph with a morph target to a CSG mesh](https://discourse.threejs.org/t/converting-a-mesh-with-morph-with-a-morph-target-to-a-csg-mesh/62501)

<div class="topic-metadata">

**Author:** [@Mostafa\_Salloum](https://discourse.threejs.org/u/Mostafa_Salloum)\
**Replies:** 3\
**Last updated:** [March 10, 2024, 3:21pm UTC](https://discourse.threejs.org/t/converting-a-mesh-with-morph-with-a-morph-target-to-a-csg-mesh/62501 "2024-03-10T15:21:11Z")

</div>

Hello, I have a 3d file with morph on one of its children in order to control its length. After making it longer using the morph, I need to perform a mesh subtraction on it using the CSG library. When I convert the mo…

---

## [Unable to create the morph target animation or animation clip from sequence of morph targets](https://discourse.threejs.org/t/unable-to-create-the-morph-target-animation-or-animation-clip-from-sequence-of-morph-targets/65312)

<div class="topic-metadata">

**Author:** [@Anish\_Kumar](https://discourse.threejs.org/u/Anish_Kumar)\
**Replies:** 1\
**Last updated:** [May 9, 2024, 1:02pm UTC](https://discourse.threejs.org/t/unable-to-create-the-morph-target-animation-or-animation-clip-from-sequence-of-morph-targets/65312 "2024-05-09T13:02:51Z")

</div>

Hey, I have GLTF model in which there are shape keys are present. I am trying to create animation clip from sequence of morph targets using “CreateFromMorphTargetSequence” from AnimationClip in threejs. I am making the a…

---

## [How to make the model mouth talking animation or lipSyncing?](https://discourse.threejs.org/t/how-to-make-the-model-mouth-talking-animation-or-lipsyncing/65244)

<div class="topic-metadata">

**Author:** [@Anish\_Kumar](https://discourse.threejs.org/u/Anish_Kumar)\
**Replies:** 0\
**Last updated:** [May 8, 2024, 11:01am UTC](https://discourse.threejs.org/t/how-to-make-the-model-mouth-talking-animation-or-lipsyncing/65244 "2024-05-08T11:01:13Z")

</div>

Hey I am trying to make the model mouth talking or lipSyncing. I have a audio file, and a model with keyshapes or morph target animation. I want that when I paly audio then the model morph target animaiton should play so…

---

## [Morph Targets with GLTF Gui](https://discourse.threejs.org/t/morph-targets-with-gltf-gui/15451)

<div class="topic-metadata">

**Author:** [@Coder](https://discourse.threejs.org/u/Coder)\
**Replies:** 3\
**Last updated:** [May 8, 2024, 6:32pm UTC](https://discourse.threejs.org/t/morph-targets-with-gltf-gui/15451 "2024-05-08T18:32:00Z")

</div>

I created a GLTF model with 2 Morph Targets. One Sphere =\> which Morphs to suzanne and also to a Cone. I loaded them in three.js and was able to produce one of the morphing through the below code. var params = { …

---

## [Is exist way to tile texturing morphed mesh without stretching?](https://discourse.threejs.org/t/is-exist-way-to-tile-texturing-morphed-mesh-without-stretching/17248)

<div class="topic-metadata">

**Author:** [@goout](https://discourse.threejs.org/u/goout)\
**Replies:** 5\
**Last updated:** [April 17, 2024, 11:56pm UTC](https://discourse.threejs.org/t/is-exist-way-to-tile-texturing-morphed-mesh-without-stretching/17248 "2024-04-17T23:56:24Z")

</div>

Hi, @Mugen87, I trust in your knowledge :pray:

---

## [How Does the Talking Head ThreeJS Project Apply Morph Targets to GLB Models in SwiftUI?](https://discourse.threejs.org/t/how-does-the-talking-head-threejs-project-apply-morph-targets-to-glb-models-in-swiftui/62209)

<div class="topic-metadata">

**Author:** [@pilsen](https://discourse.threejs.org/u/pilsen)\
**Replies:** 0\
**Last updated:** [March 3, 2024, 9:11am UTC](https://discourse.threejs.org/t/how-does-the-talking-head-threejs-project-apply-morph-targets-to-glb-models-in-swiftui/62209 "2024-03-03T09:11:32Z")

</div>

I’m working on integrating a feature similar to the Talking Head JavaScript project I found on GitHub (link to repository) into my SwiftUI project. This project uses readyplayer.me models in GLB format to create animated…

---

## [Applying morphTargetInfluences(Shape keys) to InstancedMesh](https://discourse.threejs.org/t/applying-morphtargetinfluences-shape-keys-to-instancedmesh/58593)

<div class="topic-metadata">

**Author:** [@Evan\_Jin](https://discourse.threejs.org/u/Evan_Jin)\
**Replies:** 4\
**Last updated:** [November 29, 2023, 5:08am UTC](https://discourse.threejs.org/t/applying-morphtargetinfluences-shape-keys-to-instancedmesh/58593 "2023-11-29T05:08:48Z")

</div>

My goal is to make instances of a single glb (like 1,000 counts) all looking different using morphTargetInfluences. So I made InstancedMesh in three.js and put glb geometry having morphTargetInfluences and then finally …

---

## [Get new vertices position using computeMorphedAttributes](https://discourse.threejs.org/t/get-new-vertices-position-using-computemorphedattributes/57709)

<div class="topic-metadata">

**Author:** [@ParkerLucenzo](https://discourse.threejs.org/u/ParkerLucenzo)\
**Replies:** 8\
**Last updated:** [November 6, 2023, 3:41am UTC](https://discourse.threejs.org/t/get-new-vertices-position-using-computemorphedattributes/57709 "2023-11-06T03:41:38Z")

</div>

Hello guys, I’m stuck in this issue while taking some experiments and I really need your help. I have a 3D model with shape keys animations exported from Blender. Blue dots are control points that I manually select vert…

---

## [Lip Sync with three.js by Threejs Myanmar](https://discourse.threejs.org/t/lip-sync-with-three-js-by-threejs-myanmar/57407)

<div class="topic-metadata">

**Author:** [@Threejs\_Myanmar](https://discourse.threejs.org/u/Threejs_Myanmar)\
**Replies:** 0\
**Last updated:** [October 25, 2023, 5:31pm UTC](https://discourse.threejs.org/t/lip-sync-with-three-js-by-threejs-myanmar/57407 "2023-10-25T17:31:00Z")

</div>

Just Kidding Music I made this website as a fun when I learnt about Lip Sync using threejs and readyplayerme.com

---

## [GLTFExporter, morph-targets issue](https://discourse.threejs.org/t/gltfexporter-morph-targets-issue/41117)

<div class="topic-metadata">

**Author:** [@goout](https://discourse.threejs.org/u/goout)\
**Replies:** 3\
**Last updated:** [September 5, 2023, 8:39am UTC](https://discourse.threejs.org/t/gltfexporter-morph-targets-issue/41117 "2023-09-05T08:39:10Z")

</div>

Hi to all. Faced the following problem, my scene consist of several object copies, that has different ‘morphTargetInfluences’ values, but after exporting and saving model ‘morphTargetInfluences’ have same values. When i …

---

## [Colorverse website - Particles morphing on scroll with custom shader](https://discourse.threejs.org/t/colorverse-website-particles-morphing-on-scroll-with-custom-shader/43847)

<div class="topic-metadata">

**Author:** [@nico](https://discourse.threejs.org/u/nico)\
**Replies:** 5\
**Last updated:** [September 1, 2023, 7:32am UTC](https://discourse.threejs.org/t/colorverse-website-particles-morphing-on-scroll-with-custom-shader/43847 "2023-09-01T07:32:12Z")

</div>

Happy to share with you our Three.js project create for one of our clients. Hope you will like it~ URL : https://colorver.se/ We also have a case study of this project with some code on our agency websi…

---

## [morphTargetInfluences With MeshRefractionMaterial from @react-three/drei](https://discourse.threejs.org/t/morphtargetinfluences-with-meshrefractionmaterial-from-react-three-drei/55527)

<div class="topic-metadata">

**Author:** [@Mostafa\_Salloum](https://discourse.threejs.org/u/Mostafa_Salloum)\
**Replies:** 0\
**Last updated:** [August 30, 2023, 11:23am UTC](https://discourse.threejs.org/t/morphtargetinfluences-with-meshrefractionmaterial-from-react-three-drei/55527 "2023-08-30T11:23:08Z")

</div>

Hello, I am using MeshRefractionMaterial shader on a diamond geometry, and I have trying to update the morph influences, the problem is i think that the shader is overlapping with the morphs because when i am updating t…

---

## [Morph targets with MeshRefractionMaterial](https://discourse.threejs.org/t/morph-targets-with-meshrefractionmaterial/55481)

<div class="topic-metadata">

**Author:** [@Mostafa\_Salloum](https://discourse.threejs.org/u/Mostafa_Salloum)\
**Replies:** 0\
**Last updated:** [August 29, 2023, 12:12pm UTC](https://discourse.threejs.org/t/morph-targets-with-meshrefractionmaterial/55481 "2023-08-29T12:12:00Z")

</div>

I am trying to use MeshRefractionMaterial with morph targets, when i apply the shader material morph will stop working.

---

## [Shader material with morph targets](https://discourse.threejs.org/t/shader-material-with-morph-targets/34684)

<div class="topic-metadata">

**Author:** [@bugsbun1](https://discourse.threejs.org/u/bugsbun1)\
**Replies:** 10\
**Last updated:** [August 29, 2023, 2:15pm UTC](https://discourse.threejs.org/t/shader-material-with-morph-targets/34684 "2023-08-29T14:15:02Z")

</div>

I tried to use shadermaterial with morph targets, with shadermaterial I just want to change the look of the object,not its geometry. I have not been successful in doing that. The morph targets stop working if I use shade…

---

## [Instanced Geometry and Morph Targets](https://discourse.threejs.org/t/instanced-geometry-and-morph-targets/53695)

<div class="topic-metadata">

**Author:** [@blackInk](https://discourse.threejs.org/u/blackInk)\
**Replies:** 0\
**Last updated:** [July 10, 2023, 2:45pm UTC](https://discourse.threejs.org/t/instanced-geometry-and-morph-targets/53695 "2023-07-10T14:45:54Z")

</div>

Hi, I have a general question. If I have a geometry/model with morph targets applied, can I clone and instanciate it and still use those morph targets on every single instance? Are there any good examples? Thanks for …

[Next page](https://discourse.threejs.org/tag/morph-targets/271.md?match_all_tags=true&page=1&tags%5B%5D=morph-targets)