diff --git a/snippets/border-with-top-triangle.md b/snippets/border-with-top-triangle.md
index 42121c05a..e2207c9e6 100644
--- a/snippets/border-with-top-triangle.md
+++ b/snippets/border-with-top-triangle.md
@@ -8,7 +8,7 @@ Creates a content container with a triangle at the top.
- Use the `:before` and `:after` pseudo-elements to create two triangles.
- The colors of the two triangles should be the same as the container's `border-color` and the container's `background-color` respectively.
- The `border-width` of the one triangle (`:before`) should be `1px` wider than the other one (`:after`), in order to act as the border.
-- The smalle triangle (`:after`) should be `1px` to the right of the larger triangle (`:before`) to allow for its left border to be shown.
+- The smaller triangle (`:after`) should be `1px` to the right of the larger triangle (`:before`) to allow for its left border to be shown.
```html
Border with top triangle
diff --git a/snippets/mouse-cursor-gradient-tracking.md b/snippets/mouse-cursor-gradient-tracking.md
index a093d4b69..31149e7c9 100644
--- a/snippets/mouse-cursor-gradient-tracking.md
+++ b/snippets/mouse-cursor-gradient-tracking.md
@@ -7,7 +7,7 @@ A hover effect where the gradient follows the mouse cursor.
- Declare two CSS variables, `--x` and `--y`, used to track the position of the mouse on the button.
- Declare a CSS variable, `--size`, used to modify the gradient's dimensions.
-- Use `background: radial-gradient(circle closest-side, pink, transparent);` to create the gradient at the correct postion.
+- Use `background: radial-gradient(circle closest-side, pink, transparent);` to create the gradient at the correct position.
- Use `Document.querySelector()` and `EventTarget.addEventListener()` to register a handler for the `'mousemove'` event.
- Use `Element.getBoundingClientRect()` and `CSSStyleDeclaration.setProperty()` to update the values of the `--x` and `--y` CSS variables.
diff --git a/snippets/triangle.md b/snippets/triangle.md
index aa2d8a902..23d865d54 100644
--- a/snippets/triangle.md
+++ b/snippets/triangle.md
@@ -3,7 +3,7 @@ title: Triangle
tags: visual,beginner
---
-Creates a trinagular shape with pure CSS.
+Creates a triangular shape with pure CSS.
- Use three borders to create a triangle shape.
- All borders should have the same `border-width` (`20px`).
diff --git a/snippets/truncate-text-multiline.md b/snippets/truncate-text-multiline.md
index 90c18f450..866dad5d1 100644
--- a/snippets/truncate-text-multiline.md
+++ b/snippets/truncate-text-multiline.md
@@ -7,7 +7,7 @@ Truncates text that is longer than one line.
- Use `overflow: hidden` to prevent the text from overflowing its dimensions.
- Set a fixed `width` to ensure the element has at least one constant dimension.
-- Set `height: 109.2px` as calculated from the `font-size`, using the formule `font-size * line-height * numberOfLines` (in this case `26 * 1.4 * 3 = 109.2`).
+- Set `height: 109.2px` as calculated from the `font-size`, using the formula `font-size * line-height * numberOfLines` (in this case `26 * 1.4 * 3 = 109.2`).
- Set `height: 36.4px` as calculated for the gradient container, based on the formula `font-size * line-height` (in this case `26 * 1.4 = 36.4`).
- Use `background` with `linear-gradient()` to create a gradient from `transparent` to the `background-color`.