Linear Transformation Visualizer

1. Select a preset transformation or enter custom matrix values
2. Choose a shape to transform
3. Click "Apply Transformation" for instant result or "Animate" for smooth transition
4. Toggle grid and original shape visibility

The 2×2 matrix [a,b; c,d] transforms point (x,y) to:

new_x = a×x + b×y

new_y = c×x + d×y

Matrix columns show where basis vectors (1,0) and (0,1) move to.

• Identity: No change [1,0; 0,1]
• Rotation: Rotates around origin [cos θ, -sin θ; sin θ, cos θ]
• Scaling: Stretches axes [sx, 0; 0, sy]
• Shear: Slants shape [1, k; 0, 1] or [1, 0; k, 1]
• Reflection: Flips across axis, det = -1
• Projection: Collapses dimension, det = 0

The determinant tells you how area changes:

• det = 0: Collapses to a line
• |det| = 1: Preserves area
• |det| > 1: Expands area
• |det| < 1: Contracts area
• det < 0: Reverses orientation (reflection)

To apply multiple transformations, multiply their matrices.

Important: Order matters! The rightmost matrix applies first.

Example: To rotate then scale, compute Scale × Rotation

The grid shows how the transformation warps space:

• Straight lines stay straight (fundamental property of linear transformations)
• Grid spacing shows local stretching/compression
• Grid orientation shows rotation and shearing