diff --git a/src/actions/shortcuts.ts b/src/actions/shortcuts.ts
index cca518dad7..2227dc1d94 100644
--- a/src/actions/shortcuts.ts
+++ b/src/actions/shortcuts.ts
@@ -71,6 +71,6 @@ const shortcutMap: Record<ShortcutName, string[]> = {
 
 export const getShortcutFromShortcutName = (name: ShortcutName) => {
   const shortcuts = shortcutMap[name];
-  // if multiple shortcuts availiable, take the first one
+  // if multiple shortcuts available, take the first one
   return shortcuts && shortcuts.length > 0 ? shortcuts[0] : "";
 };
diff --git a/src/charts.ts b/src/charts.ts
index f36a076e47..53013a7b1c 100644
--- a/src/charts.ts
+++ b/src/charts.ts
@@ -103,7 +103,7 @@ const transposeCells = (cells: string[][]) => {
 };
 
 export const tryParseSpreadsheet = (text: string): ParseSpreadsheetResult => {
-  // Copy/paste from excel, spreadhseets, tsv, csv.
+  // Copy/paste from excel, spreadsheets, tsv, csv.
   // For now we only accept 2 columns with an optional header
 
   // Check for tab separated values
diff --git a/src/clipboard.ts b/src/clipboard.ts
index a0d737e739..94a2dfa6b6 100644
--- a/src/clipboard.ts
+++ b/src/clipboard.ts
@@ -124,7 +124,7 @@ const getSystemClipboard = async (
 };
 
 /**
- * Attemps to parse clipboard. Prefers system clipboard.
+ * Attempts to parse clipboard. Prefers system clipboard.
  */
 export const parseClipboard = async (
   event: ClipboardEvent | null,
diff --git a/src/components/App.tsx b/src/components/App.tsx
index ae5376fa68..f62380b255 100644
--- a/src/components/App.tsx
+++ b/src/components/App.tsx
@@ -2245,7 +2245,7 @@ class App extends React.Component<AppProps, AppState> {
         element,
       ]);
 
-      // case: creating new text not centered to parent elemenent → offset Y
+      // case: creating new text not centered to parent element → offset Y
       // so that the text is centered to cursor position
       if (!parentCenterPosition) {
         mutateElement(element, {
@@ -3006,7 +3006,7 @@ class App extends React.Component<AppProps, AppState> {
         /*
          * Reenable next paste in case of disabled middle click paste for
          * any reason:
-         * - rigth click paste
+         * - right click paste
          * - empty clipboard
          */
         const enableNextPaste = () => {
@@ -4742,7 +4742,7 @@ class App extends React.Component<AppProps, AppState> {
       const width = height * (image.naturalWidth / image.naturalHeight);
 
       // add current imageElement width/height to account for previous centering
-      // of the placholder image
+      // of the placeholder image
       const x = imageElement.x + imageElement.width / 2 - width / 2;
       const y = imageElement.y + imageElement.height / 2 - height / 2;
 
diff --git a/src/components/LayerUI.tsx b/src/components/LayerUI.tsx
index 5aca7af45a..65c8551de2 100644
--- a/src/components/LayerUI.tsx
+++ b/src/components/LayerUI.tsx
@@ -238,7 +238,7 @@ const LayerUI = ({
         className={CLASSES.SHAPE_ACTIONS_MENU}
         padding={2}
         style={{
-          // we want to make sure this doesn't overflow so substracting 200
+          // we want to make sure this doesn't overflow so subtracting 200
           // which is approximately height of zoom footer and top left menu items with some buffer
           // if active file name is displayed, subtracting 248 to account for its height
           maxHeight: `${appState.height - (appState.fileHandle ? 248 : 200)}px`,
diff --git a/src/element/collision.ts b/src/element/collision.ts
index c00953aab5..44bce78d27 100644
--- a/src/element/collision.ts
+++ b/src/element/collision.ts
@@ -646,7 +646,7 @@ const getCorners = (
 
 // Returns intersection of `line` with `segment`, with `segment` moved by
 // `gap` in its polar direction.
-// If intersection conincides with second segment point returns empty array.
+// If intersection coincides with second segment point returns empty array.
 const intersectSegment = (
   line: GA.Line,
   segment: [GA.Point, GA.Point],
diff --git a/src/element/linearElementEditor.ts b/src/element/linearElementEditor.ts
index ee4da2dd65..51ddc4926b 100644
--- a/src/element/linearElementEditor.ts
+++ b/src/element/linearElementEditor.ts
@@ -401,7 +401,7 @@ export class LinearElementEditor {
       ret.hitElement = element;
     } else {
       // You might be wandering why we are storing the binding elements on
-      // LinearElementEditor and passing them in, insted of calculating them
+      // LinearElementEditor and passing them in, instead of calculating them
       // from the end points of the `linearElement` - this is to allow disabling
       // binding (which needs to happen at the point the user finishes moving
       // the point).
diff --git a/src/element/sizeHelpers.test.ts b/src/element/sizeHelpers.test.ts
index 87634b5530..14c10d1522 100644
--- a/src/element/sizeHelpers.test.ts
+++ b/src/element/sizeHelpers.test.ts
@@ -32,7 +32,7 @@ describe("getPerfectElementSize", () => {
     expect(width).toEqual(135);
     expect(height).toEqual(135);
   });
-  it("should return height:0 and width:0 when width and heigh are 0", () => {
+  it("should return height:0 and width:0 when width and height are 0", () => {
     const { height, width } = getPerfectElementSize("arrow", 0, 0);
     expect(width).toEqual(0);
     expect(height).toEqual(0);
diff --git a/src/element/textWysiwyg.tsx b/src/element/textWysiwyg.tsx
index a62efb4539..7eeebe5447 100644
--- a/src/element/textWysiwyg.tsx
+++ b/src/element/textWysiwyg.tsx
@@ -114,7 +114,7 @@ export const textWysiwyg = ({
 
       let maxHeight = updatedElement.height;
       let width = updatedElement.width;
-      // Set to element height by default since thats
+      // Set to element height by default since that's
       // what is going to be used for unbounded text
       let height = updatedElement.height;
       if (container && updatedElement.containerId) {
@@ -170,7 +170,7 @@ export const textWysiwyg = ({
       const initialLength = editable.value.length;
       editable.value = updatedElement.originalText;
 
-      // restore cursor positon after value updated so it doesn't
+      // restore cursor position after value updated so it doesn't
       // go to the end of text when container auto expanded
       if (
         initialSelectionStart === initialSelectionEnd &&
@@ -275,7 +275,7 @@ export const textWysiwyg = ({
       // as that gets updated below
       const lines = editable.scrollHeight / getApproxLineHeight(font);
       // auto increase height only when lines  > 1 so its
-      // measured correctly and vertically alignes for
+      // measured correctly and vertically aligns for
       // first line as well as setting height to "auto"
       // doubles the height as soon as user starts typing
       if (isBoundToContainer(element) && lines > 1) {
@@ -414,7 +414,7 @@ export const textWysiwyg = ({
   };
 
   /**
-   * @returns indeces of start positions of selected lines, in reverse order
+   * @returns indices of start positions of selected lines, in reverse order
    */
   const getSelectedLinesStartIndices = () => {
     let { selectionStart, selectionEnd, value } = editable;
diff --git a/src/ga.ts b/src/ga.ts
index f2e27e0cb6..271aa7ae9d 100644
--- a/src/ga.ts
+++ b/src/ga.ts
@@ -62,7 +62,7 @@ const NVECTOR_BASE = ["1", "e0", "e1", "e2", "e01", "e20", "e12", "e012"];
 export const nvector = (value: number = 0, index: number = 0): NVector => {
   const result = [0, 0, 0, 0, 0, 0, 0, 0];
   if (index < 0 || index > 7) {
-    throw new Error(`Expected \`index\` betwen 0 and 7, got \`${index}\``);
+    throw new Error(`Expected \`index\` between 0 and 7, got \`${index}\``);
   }
   if (value !== 0) {
     result[index] = value;
diff --git a/src/galines.ts b/src/galines.ts
index 015476a3f2..28bc197fe9 100644
--- a/src/galines.ts
+++ b/src/galines.ts
@@ -7,7 +7,7 @@ import { Line, Point } from "./ga";
  *
  * This maps to a standard formula `a * x + b * y + c`.
  *
- * `(-b, a)` correponds to a 2D vector parallel to the line. The lines
+ * `(-b, a)` corresponds to a 2D vector parallel to the line. The lines
  * have a natural orientation, corresponding to that vector.
  *
  * The magnitude ("norm") of the line is `sqrt(a ^ 2 + b ^ 2)`.
diff --git a/src/packages/excalidraw/CHANGELOG.md b/src/packages/excalidraw/CHANGELOG.md
index 78cc457ca3..d399d2565e 100644
--- a/src/packages/excalidraw/CHANGELOG.md
+++ b/src/packages/excalidraw/CHANGELOG.md
@@ -20,7 +20,7 @@ Please add the latest change on the top under the correct section.
 - Add `onLinkOpen` prop which will be triggered when clicked on element hyperlink if present [#4694](https://github.com/excalidraw/excalidraw/pull/4694).
 - Support updating library using [`updateScene`](https://github.com/excalidraw/excalidraw/blob/master/src/packages/excalidraw/README.md#updateScene) API [#4546](https://github.com/excalidraw/excalidraw/pull/4546).
 
-- Introduced primary colors to the app. The colors can be overriden. Check [readme](https://github.com/excalidraw/excalidraw/blob/master/src/packages/excalidraw/README.md#customizing-styles) on how to do so [#4387](https://github.com/excalidraw/excalidraw/pull/4387).
+- Introduced primary colors to the app. The colors can be overridden. Check [readme](https://github.com/excalidraw/excalidraw/blob/master/src/packages/excalidraw/README.md#customizing-styles) on how to do so [#4387](https://github.com/excalidraw/excalidraw/pull/4387).
 
 - [`exportToBlob`](https://github.com/excalidraw/excalidraw/blob/master/src/packages/excalidraw/README.md#exportToBlob) now automatically sets `appState.exportBackground` to `true` if exporting to `image/jpeg` MIME type (to ensure that alpha channel is not compressed to black color) [#4342](https://github.com/excalidraw/excalidraw/pull/4342).
 
@@ -115,7 +115,7 @@ Please add the latest change on the top under the correct section.
 
 - Sync local storage state across tabs when out of sync [#4545](https://github.com/excalidraw/excalidraw/pull/4545)
 
-- Support contextMenuLabel to be of function type to support dynmaic labels [#4654](https://github.com/excalidraw/excalidraw/pull/4654)
+- Support contextMenuLabel to be of function type to support dynamic labels [#4654](https://github.com/excalidraw/excalidraw/pull/4654)
 
 - Support decreasing/increasing `fontSize` via keyboard [#4553](https://github.com/excalidraw/excalidraw/pull/4553)
 
@@ -438,10 +438,10 @@ Please add the latest change on the top under the correct section.
 
 - Added prop [`autoFocus`](https://github.com/excalidraw/excalidraw/blob/master/src/packages/excalidraw/README.md#autoFocus) to focus the excalidraw component on page load when enabled, defaults to false [#3691](https://github.com/excalidraw/excalidraw/pull/3691).
 
-  Note: Earlier Excalidraw component was focussed by default on page load, you need to enable `autoFocus` prop to retain the same behaviour.
+  Note: Earlier Excalidraw component was focused by default on page load, you need to enable `autoFocus` prop to retain the same behaviour.
 
 - Added prop `UIOptions.canvasActions.export.renderCustomUI` to support Custom UI rendering inside export dialog [#3666](https://github.com/excalidraw/excalidraw/pull/3666).
-- Added prop `UIOptions.canvasActions.saveAsImage` to show/hide the **Save as image** button in the canvas actions. Defauls to `true` hence the **Save as Image** button is rendered [#3662](https://github.com/excalidraw/excalidraw/pull/3662).
+- Added prop `UIOptions.canvasActions.saveAsImage` to show/hide the **Save as image** button in the canvas actions. Defaults to `true` hence the **Save as Image** button is rendered [#3662](https://github.com/excalidraw/excalidraw/pull/3662).
 
 - Export dialog can be customised with [`UiOptions.canvasActions.export`](https://github.com/excalidraw/excalidraw/blob/master/src/packages/excalidraw/README.md#exportOpts) [#3658](https://github.com/excalidraw/excalidraw/pull/3658).
 
@@ -489,7 +489,7 @@ Please add the latest change on the top under the correct section.
 
 - Exporting redesign [#3613](https://github.com/excalidraw/excalidraw/pull/3613)
 
-- Auto-position tooltip and suport overflowing container [#3631](https://github.com/excalidraw/excalidraw/pull/3631)
+- Auto-position tooltip and support overflowing container [#3631](https://github.com/excalidraw/excalidraw/pull/3631)
 
 - Auto release @excalidraw/excalidraw-next on every change [#3614](https://github.com/excalidraw/excalidraw/pull/3614)
 
diff --git a/src/packages/excalidraw/README.md b/src/packages/excalidraw/README.md
index 6a65e2a318..a6f7d3e6f0 100644
--- a/src/packages/excalidraw/README.md
+++ b/src/packages/excalidraw/README.md
@@ -425,7 +425,7 @@ Here you can try saving the data to your backend or local storage for example.
 
 This helps to load Excalidraw with `initialData`. It must be an object or a [promise](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/Promise) which resolves to an object containing the below optional fields.
 
-| Name | Type | Descrption |
+| Name | Type | Description |
 | --- | --- | --- |
 | `elements` | [ExcalidrawElement[]](https://github.com/excalidraw/excalidraw/blob/master/src/element/types.ts#L78) | The elements with which Excalidraw should be mounted. |
 | `appState` | [AppState](https://github.com/excalidraw/excalidraw/blob/master/src/types.ts#L42) | The App state with which Excalidraw should be mounted. |
@@ -679,7 +679,7 @@ Enable this if you want Excalidraw to handle keyboard even if the component isn'
 
 #### `onLibraryChange`
 
-Ths callback if supplied will get triggered when the library is updated and has the below signature.
+This callback if supplied will get triggered when the library is updated and has the below signature.
 
 <pre>
 (items: <a href="https://github.com/excalidraw/excalidraw/blob/master/src/types.ts#L200">LibraryItems</a>) => void | Promise<any>
diff --git a/src/packages/excalidraw/README_NEXT.md b/src/packages/excalidraw/README_NEXT.md
index 63655d6e8e..268e65fbf5 100644
--- a/src/packages/excalidraw/README_NEXT.md
+++ b/src/packages/excalidraw/README_NEXT.md
@@ -431,7 +431,7 @@ Here you can try saving the data to your backend or local storage for example.
 
 This helps to load Excalidraw with `initialData`. It must be an object or a [promise](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/Promise) which resolves to an object containing the below optional fields.
 
-| Name | Type | Descrption |
+| Name | Type | Description |
 | --- | --- | --- |
 | `elements` | [ExcalidrawElement[]](https://github.com/excalidraw/excalidraw/blob/master/src/element/types.ts#L78) | The elements with which Excalidraw should be mounted. |
 | `appState` | [AppState](https://github.com/excalidraw/excalidraw/blob/master/src/types.ts#L42) | The App state with which Excalidraw should be mounted. |
@@ -685,7 +685,7 @@ Enable this if you want Excalidraw to handle keyboard even if the component isn'
 
 #### `onLibraryChange`
 
-Ths callback if supplied will get triggered when the library is updated and has the below signature.
+This callback if supplied will get triggered when the library is updated and has the below signature.
 
 <pre>
 (items: <a href="https://github.com/excalidraw/excalidraw/blob/master/src/types.ts#L200">LibraryItems</a>) => void | Promise<any>
diff --git a/src/packages/excalidraw/example/App.js b/src/packages/excalidraw/example/App.js
index d12066aea9..cca5706952 100644
--- a/src/packages/excalidraw/example/App.js
+++ b/src/packages/excalidraw/example/App.js
@@ -7,7 +7,7 @@ import "./App.scss";
 import initialData from "./initialData";
 import { MIME_TYPES } from "../../../constants";
 
-// This is so that we use the bundled excalidraw.developement.js file instead
+// This is so that we use the bundled excalidraw.development.js file instead
 // of the actual source code
 const { exportToCanvas, exportToSvg, exportToBlob } = window.Excalidraw;
 const Excalidraw = window.Excalidraw.default;
diff --git a/src/packages/excalidraw/example/public/index.html b/src/packages/excalidraw/example/public/index.html
index 9a36577415..5256209e39 100644
--- a/src/packages/excalidraw/example/public/index.html
+++ b/src/packages/excalidraw/example/public/index.html
@@ -20,7 +20,7 @@
     <script src="https://unpkg.com/react@17.0.2/umd/react.development.js"></script>
     <script src="https://unpkg.com/react-dom@17.0.2/umd/react-dom.development.js"></script>
 
-    <!-- This is so that we use the bundled excalidraw.developement.js file instead
+    <!-- This is so that we use the bundled excalidraw.development.js file instead
     of the actual source code -->
     <script src="./excalidraw.development.js"></script>
 
diff --git a/src/points.ts b/src/points.ts
index 7806203538..c407ffbbfd 100644
--- a/src/points.ts
+++ b/src/points.ts
@@ -37,7 +37,7 @@ export const rescalePoints = (
   );
 
   if (scaledPoints.length === 2) {
-    // we don't tranlate two-point lines
+    // we don't translate two-point lines
     return scaledPoints;
   }
 
diff --git a/src/scene/export.ts b/src/scene/export.ts
index 1f46bd9ff1..d404e822bd 100644
--- a/src/scene/export.ts
+++ b/src/scene/export.ts
@@ -104,7 +104,7 @@ export const exportToSvg = async (
   }
   const [minX, minY, width, height] = getCanvasSize(elements, exportPadding);
 
-  // initialze SVG root
+  // initialize SVG root
   const svgRoot = document.createElementNS(SVG_NS, "svg");
   svgRoot.setAttribute("version", "1.1");
   svgRoot.setAttribute("xmlns", SVG_NS);
diff --git a/src/tests/__snapshots__/regressionTests.test.tsx.snap b/src/tests/__snapshots__/regressionTests.test.tsx.snap
index 837a518e76..2b4eee9e02 100644
--- a/src/tests/__snapshots__/regressionTests.test.tsx.snap
+++ b/src/tests/__snapshots__/regressionTests.test.tsx.snap
@@ -9212,7 +9212,7 @@ exports[`regression tests given a group of selected elements with an element tha
 
 exports[`regression tests given a group of selected elements with an element that is not selected inside the group common bounding box when element that is not selected is clicked should switch selection to not selected element on pointer up: [end of test] number of renders 1`] = `20`;
 
-exports[`regression tests given a selected element A and a not selected element B with higher z-index than A and given B partialy overlaps A when there's a shift-click on the overlapped section B is added to the selection: [end of test] appState 1`] = `
+exports[`regression tests given a selected element A and a not selected element B with higher z-index than A and given B partially overlaps A when there's a shift-click on the overlapped section B is added to the selection: [end of test] appState 1`] = `
 Object {
   "collaborators": Map {},
   "currentChartType": "bar",
@@ -9298,7 +9298,7 @@ Object {
 }
 `;
 
-exports[`regression tests given a selected element A and a not selected element B with higher z-index than A and given B partialy overlaps A when there's a shift-click on the overlapped section B is added to the selection: [end of test] element 0 1`] = `
+exports[`regression tests given a selected element A and a not selected element B with higher z-index than A and given B partially overlaps A when there's a shift-click on the overlapped section B is added to the selection: [end of test] element 0 1`] = `
 Object {
   "angle": 0,
   "backgroundColor": "#fa5252",
@@ -9326,7 +9326,7 @@ Object {
 }
 `;
 
-exports[`regression tests given a selected element A and a not selected element B with higher z-index than A and given B partialy overlaps A when there's a shift-click on the overlapped section B is added to the selection: [end of test] element 1 1`] = `
+exports[`regression tests given a selected element A and a not selected element B with higher z-index than A and given B partially overlaps A when there's a shift-click on the overlapped section B is added to the selection: [end of test] element 1 1`] = `
 Object {
   "angle": 0,
   "backgroundColor": "#fa5252",
@@ -9354,7 +9354,7 @@ Object {
 }
 `;
 
-exports[`regression tests given a selected element A and a not selected element B with higher z-index than A and given B partialy overlaps A when there's a shift-click on the overlapped section B is added to the selection: [end of test] history 1`] = `
+exports[`regression tests given a selected element A and a not selected element B with higher z-index than A and given B partially overlaps A when there's a shift-click on the overlapped section B is added to the selection: [end of test] history 1`] = `
 Object {
   "recording": false,
   "redoStack": Array [],
@@ -9475,9 +9475,9 @@ Object {
 }
 `;
 
-exports[`regression tests given a selected element A and a not selected element B with higher z-index than A and given B partialy overlaps A when there's a shift-click on the overlapped section B is added to the selection: [end of test] number of elements 1`] = `2`;
+exports[`regression tests given a selected element A and a not selected element B with higher z-index than A and given B partially overlaps A when there's a shift-click on the overlapped section B is added to the selection: [end of test] number of elements 1`] = `2`;
 
-exports[`regression tests given a selected element A and a not selected element B with higher z-index than A and given B partialy overlaps A when there's a shift-click on the overlapped section B is added to the selection: [end of test] number of renders 1`] = `18`;
+exports[`regression tests given a selected element A and a not selected element B with higher z-index than A and given B partially overlaps A when there's a shift-click on the overlapped section B is added to the selection: [end of test] number of renders 1`] = `18`;
 
 exports[`regression tests given selected element A with lower z-index than unselected element B and given B is partially over A when clicking intersection between A and B B should be selected on pointer up: [end of test] appState 1`] = `
 Object {
diff --git a/src/tests/reconciliation.test.ts b/src/tests/reconciliation.test.ts
index 763172927e..712074f7ce 100644
--- a/src/tests/reconciliation.test.ts
+++ b/src/tests/reconciliation.test.ts
@@ -148,7 +148,7 @@ describe("elements reconciliation", () => {
 
     // non-annotated elements
     // -------------------------------------------------------------------------
-    // usually when we sync elements they should always be annonated with
+    // usually when we sync elements they should always be annotated with
     // their (preceding elements) parents, but let's test a couple of cases when
     // they're not for whatever reason (remote clients are on older version...),
     // in which case the first synced element either replaces existing element
diff --git a/src/tests/regressionTests.test.tsx b/src/tests/regressionTests.test.tsx
index 7b950e3da8..89b50e30f4 100644
--- a/src/tests/regressionTests.test.tsx
+++ b/src/tests/regressionTests.test.tsx
@@ -946,7 +946,7 @@ describe("regression tests", () => {
 
   it(
     "given a selected element A and a not selected element B with higher z-index than A " +
-      "and given B partialy overlaps A " +
+      "and given B partially overlaps A " +
       "when there's a shift-click on the overlapped section B is added to the selection",
     () => {
       UI.clickTool("rectangle");
diff --git a/src/types.ts b/src/types.ts
index 57ba637120..376cd61573 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -365,9 +365,9 @@ export type PointerDownState = Readonly<{
   };
   withCmdOrCtrl: boolean;
   drag: {
-    // Might change during the pointer interation
+    // Might change during the pointer interaction
     hasOccurred: boolean;
-    // Might change during the pointer interation
+    // Might change during the pointer interaction
     offset: { x: number; y: number } | null;
   };
   // We need to have these in the state so that we can unsubscribe them