diff --git a/src/components/liquid/LiquidEffect.js b/src/components/liquid/LiquidEffect.js
index f6b0323..080b858 100644
--- a/src/components/liquid/LiquidEffect.js
+++ b/src/components/liquid/LiquidEffect.js
@@ -3,7 +3,7 @@ import {
   Mesh,
   NearestFilter,
   OrthographicCamera,
-  PlaneBufferGeometry,
+  PlaneGeometry,
   RGBAFormat,
   ShaderMaterial,
   Uniform,
@@ -181,7 +181,7 @@ LiquidEffect.prototype.swapBuffers = function () {
 // from https://threejs.org/examples/js/postprocessing/EffectComposer.js
 const FullScreenQuad = (function () {
   const camera = new OrthographicCamera(-1, 1, 1, -1, 0, 1);
-  const geometry = new PlaneBufferGeometry(2, 2);
+  const geometry = new PlaneGeometry(2, 2);
 
   const FullScreenQuad = function (material) {
     this._mesh = new Mesh(geometry, material);
diff --git a/src/components/liquid/LiquidPlane.js b/src/components/liquid/LiquidPlane.js
index f9caa30..37d29bf 100644
--- a/src/components/liquid/LiquidPlane.js
+++ b/src/components/liquid/LiquidPlane.js
@@ -1,4 +1,4 @@
-import { DoubleSide, Mesh, MeshStandardMaterial, PlaneBufferGeometry } from 'three';
+import { DoubleSide, Mesh, MeshStandardMaterial, PlaneGeometry } from 'three';
 import { watch } from 'vue';
 import Object3D from '../../core/Object3D.js';
 import { bindProps } from '../../tools.js';
@@ -39,7 +39,7 @@ export default {
     bindProps(this, ['metalness', 'roughness'], this.material);
     watch(() => this.color, (value) => this.material.color.set(value));
 
-    this.geometry = new PlaneBufferGeometry(this.width, this.height, this.widthSegments, this.heightSegments);
+    this.geometry = new PlaneGeometry(this.width, this.height, this.widthSegments, this.heightSegments);
     this.mesh = new Mesh(this.geometry, this.material);
     this.initObject3D(this.mesh);
   },
diff --git a/src/components/noisy/NoisyImage.js b/src/components/noisy/NoisyImage.js
index ed29beb..2bcc0cc 100644
--- a/src/components/noisy/NoisyImage.js
+++ b/src/components/noisy/NoisyImage.js
@@ -1,4 +1,4 @@
-import { DoubleSide, MeshBasicMaterial, PlaneBufferGeometry } from 'three';
+import { DoubleSide, MeshBasicMaterial, PlaneGeometry } from 'three';
 import { watch } from 'vue';
 import Image from '../../meshes/Image.js';
 import snoise2 from '../../glsl/snoise2.glsl.js';
@@ -36,7 +36,7 @@ export default {
   },
   methods: {
     createGeometry() {
-      this.geometry = new PlaneBufferGeometry(1, 1, this.widthSegments, this.heightSegments);
+      this.geometry = new PlaneGeometry(1, 1, this.widthSegments, this.heightSegments);
     },
     createMaterial() {
       this.material = new MeshBasicMaterial({ side: DoubleSide, map: this.loadTexture() });
diff --git a/src/components/sliders/ZoomBlurImage.js b/src/components/sliders/ZoomBlurImage.js
index a83e65d..a8d1323 100644
--- a/src/components/sliders/ZoomBlurImage.js
+++ b/src/components/sliders/ZoomBlurImage.js
@@ -1,6 +1,6 @@
 import {
   Mesh,
-  PlaneBufferGeometry,
+  PlaneGeometry,
   ShaderMaterial,
   Vector2,
 } from 'three';
@@ -19,7 +19,7 @@ export default function ZoomBlurImage(three) {
   return { geometry, material, mesh, uCenter, uStrength, setMap, updateUV };
 
   function init() {
-    geometry = new PlaneBufferGeometry(2, 2, 1, 1);
+    geometry = new PlaneGeometry(2, 2, 1, 1);
 
     material = new ShaderMaterial({
       transparent: true,
diff --git a/src/meshes/Image.js b/src/meshes/Image.js
index f1cb9c1..184d0e2 100644
--- a/src/meshes/Image.js
+++ b/src/meshes/Image.js
@@ -1,4 +1,4 @@
-import { DoubleSide, MeshBasicMaterial, PlaneBufferGeometry, TextureLoader } from 'three';
+import { DoubleSide, MeshBasicMaterial, PlaneGeometry, TextureLoader } from 'three';
 import { watch } from 'vue';
 import Mesh from './Mesh.js';
 
@@ -26,7 +26,7 @@ export default {
   },
   methods: {
     createGeometry() {
-      this.geometry = new PlaneBufferGeometry(1, 1, 1, 1);
+      this.geometry = new PlaneGeometry(1, 1, 1, 1);
     },
     createMaterial() {
       this.material = new MeshBasicMaterial({ side: DoubleSide, map: this.loadTexture() });
diff --git a/src/meshes/Plane.js b/src/meshes/Plane.js
index 5955804..3f201bc 100644
--- a/src/meshes/Plane.js
+++ b/src/meshes/Plane.js
@@ -1,4 +1,4 @@
-import { PlaneBufferGeometry } from 'three';
+import { PlaneGeometry } from 'three';
 import { watch } from 'vue';
 import Mesh from './Mesh.js';
 
@@ -22,7 +22,7 @@ export default {
   },
   methods: {
     createGeometry() {
-      this.geometry = new PlaneBufferGeometry(this.width, this.height, this.widthSegments, this.heightSegments);
+      this.geometry = new PlaneGeometry(this.width, this.height, this.widthSegments, this.heightSegments);
     },
   },
   __hmrId: 'Plane',
diff --git a/src/meshes/Text.js b/src/meshes/Text.js
index ca9e4d9..ddf3b23 100644
--- a/src/meshes/Text.js
+++ b/src/meshes/Text.js
@@ -1,4 +1,4 @@
-import { FontLoader, TextBufferGeometry } from 'three';
+import { FontLoader, TextGeometry } from 'three';
 import { watch } from 'vue';
 import Mesh from './Mesh.js';
 import TextProps from './TextProps.js';
@@ -36,7 +36,7 @@ export default {
   },
   methods: {
     createGeometry() {
-      this.geometry = new TextBufferGeometry(this.text, {
+      this.geometry = new TextGeometry(this.text, {
         font: this.font,
         size: this.size,
         height: this.height,