diff --git a/index.html b/index.html
index fcaa367aee897edea464ca7bc0e9516cbed79d55..3b8f831483afda0aa63416abb876082d61eee55a 100644
--- a/index.html
+++ b/index.html
@@ -15,6 +15,6 @@
     <script type="module" src="/src/cg/perspectiveDivide.ts"></script>
     <script type="module" src="/src/cg/walkToVec.ts"></script>
     <script type="module" src="/src/cg/basis.ts"></script-->
-    <script type="module" src="/src/cg/testing.ts"></script>
+    <script type="module" src="/src/cg/shear.ts"></script>
   </body>
 </html>
diff --git a/src/cg/shear.ts b/src/cg/shear.ts
new file mode 100644
index 0000000000000000000000000000000000000000..705db641bf25551b81d26754753acf086283a812
--- /dev/null
+++ b/src/cg/shear.ts
@@ -0,0 +1,22 @@
+import Playground from "./playground";
+import * as Utils from './utils';
+
+const pg = new Playground();
+pg.gridXZ();
+
+const points = [
+    [0,0,0],[0,0,1],[0,1,0],[0,1,1],[1,0,0],[1,0,1],[1,1,0],[1,1,1]
+]
+
+for(let p of points){
+    pg.visPoint(p);
+}
+
+const shear = [
+    1, 0, 0.5,
+    0, 1, 0,
+    0, 0, 1
+]
+pg.visVector([shear[0], shear[1], shear[2]], { color: "red" });
+pg.visVector([shear[3], shear[4], shear[5]], { color: "green" })
+pg.visVector([shear[6], shear[7], shear[8]], { color: "blue" })
\ No newline at end of file