The idea: slide every row by k times its height
A shear pushes the plane sideways the way you push a deck of cards. The horizontal shear with factor k moves each point (x, y) to (x + k·y, y): the point stays in its row and slides along it by k·y. The row at height 1 slides k, the row at height 2 slides 2k, rows below the axis slide the other way, and the x-axis itself (y = 0) does not move at all.
On the canvas the grey grid is where the points were before the change and the blue grid is where they are now. The purple arrows show how far the rows y = 1 and y = 2 slid, the light-blue lines in the unit square are its "cards", and the orange letter F shows the picture leaning over (Demo: slide like a deck of cards (k = 1)).
The matrix: where î and ĵ land
As for every linear map, the columns of the matrix are where î = (1, 0) and ĵ = (0, 1) land. î lies on the x-axis, so it does not move; ĵ is at height 1, so it slides to (k, 1). That gives
Row times column: with k = 1 and v = (1, 2), row 1 gives 1·1 + 1·2 = 3 and row 2 gives 0·1 + 1·2 = 2, so v lands at (3, 2). Only x changed, by k·y = 2. The point panel on the canvas works this out for the vector you pick, and the two sums fly into M·v.
The area stays the same: det = 1
The unit square becomes a parallelogram. Its bottom side is on the x-axis, so it is still 1 long, and its top side slid along the line y = 1, so it is still 1 above the bottom. Same base, same height: the area is still 1. The determinant says the same for every shape: det H(k) = 1·1 − k·0 = 1. It is positive, so the orientation is kept too: going from î to ĵ is still a left turn (Demo: area stays the same).
What a shear keeps and what it changes
| Property | Kept by H(k)? | Why |
|---|---|---|
| area | ✓ yes | det = 1 |
| orientation | ✓ yes | det > 0, no flip |
| lines through 0, parallel lines | ✓ yes | every linear map keeps them |
| points on the x-axis | ✓ yes, each one | y = 0 slides 0 |
| lengths | ✗ no | ĵ goes to (k, 1), length √(1 + k²) |
| angles | ✗ no | the right angle between î and ĵ becomes 45° for k = 1 |
A map that keeps area but not lengths and angles is neither a rotation nor a reflection; compare rotation, which keeps all of them.
Only one eigen-direction
An eigenvector stays on its own line through 0. For a shear, det(H − λI) = (1 − λ)² = 0, so λ = 1, twice. But H − I = [0 k; 0 0] sends (x, y) to (k·y, 0), which is 0 only for y = 0. So the eigenvectors are the x-axis and nothing else: the double eigenvalue has only one line of eigenvectors. Such a matrix is called defective. There is no basis of eigenvectors, so a shear (k ≠ 0) cannot be diagonalized, unlike a scaling (Demo: only the x-axis keeps its direction: of three test arrows only the one on the x-axis stays on its line).
The inverse is −k, and shears add
To undo a slide of k·y, slide back by k·y: H(k)−1 = H(−k) = [1 −k; 0 1]. The 2×2 inverse formula agrees: swap the diagonal (1 and 1), negate k, divide by det = 1 (Demo: undo with −k). Two shears in the same direction add their slides, so they add their factors (Demo: shears add: ½ then 1 = 1½):
So shears of one direction commute. Shears of different directions do not: H(1)V(1) = [2 1; 1 1] but V(1)H(1) = [1 1; 1 2] (see Matrix Multiplication). That is why the canvas goes back to the identity before it switches direction.
Shears in row reduction and in type
Multiplying a matrix A on the left by H(k) adds k times row 2 to row 1: exactly the row operation of Gaussian elimination. Every "add a multiple of one row to another" step is a shear, which is why those steps never change the determinant. The facts panel on the canvas names the row operation for the current k.
Slanted type is a shear too: a synthetic oblique (italic) font takes each upright letter and slides it by about 0.2·y, a shear with k ≈ 0.2 (a slant of about 12°). The orange F on the canvas leans the same way. CSS skewX(θ) is the shear with k = tan θ.
The vertical shear
The vertical shear V(k) = [1 0; k 1] moves (x, y) to (x, y + k·x): columns slide up by k·x and the y-axis stays put. Everything above holds with the roles of x and y swapped: det = 1, one eigen-direction (the y-axis), inverse V(−k), and V(k)·A adds k times row 1 to row 2. It is the transpose of H(k). With k = 1, v = (2, 1) lands at (2, 3) (Demo: vertical shear).
See also the overview Linear Transformations (columns, change of basis, singular maps) and the other basic transforms: Rotation Matrix, Reflection Matrix, Scaling Matrix and Projection Matrix.
What the page leaves out
Only shears along the x- or y-axis with k from −2 to 2 in steps of ½ are drawn, so the grid stays inside the panel. Shears along any other line (PH(k)P−1, still det = 1), shears in 3D (one coordinate slides by a mix of the other two), the fact that every rotation is three shears in a row (used to rotate images without blurring), and shear in mechanics (shear strain and stress in a material) are not shown.