diff --git a/src/materials/ToonMaterial.js b/src/materials/ToonMaterial.js
new file mode 100644
index 0000000..cadce9f
--- /dev/null
+++ b/src/materials/ToonMaterial.js
@@ -0,0 +1,13 @@
+import { MeshToonMaterial } from 'three';
+import { propsValues } from '../tools.js';
+import Material from './Material';
+
+export default {
+  extends: Material,
+  methods: {
+    createMaterial() {
+      this.material = new MeshToonMaterial(propsValues(this.$props, ['id']));
+    },
+  },
+  __hmrId: 'ToonMaterial',
+};
diff --git a/src/materials/index.js b/src/materials/index.js
index 4c4a3be..82c40b7 100644
--- a/src/materials/index.js
+++ b/src/materials/index.js
@@ -4,3 +4,4 @@ export { default as PhongMaterial } from './PhongMaterial.js';
 export { default as PhysicalMaterial } from './PhysicalMaterial.js';
 export { default as StandardMaterial } from './StandardMaterial.js';
 export { default as SubSurfaceMaterial } from './SubSurfaceMaterial.js';
+export { default as ToonMaterial } from './ToonMaterial.js';
diff --git a/src/plugin.js b/src/plugin.js
index f4605f4..a63bb3d 100644
--- a/src/plugin.js
+++ b/src/plugin.js
@@ -36,6 +36,7 @@ export const TroisJSVuePlugin = {
       'ShaderMaterial',
       'StandardMaterial',
       'SubSurfaceMaterial',
+      'ToonMaterial',
 
       'Box',
       'Circle',