Visualizing matrix rotation

  • typescript
  • react
  • framer-motion
  • algorithm

I made a little React app for visualizing how an in-place matrix rotation algorithm works.

You can click a square to select it, press Enter once you’ve got four selected to swap them in order of selection, and Esc to clear the selection. A green background means that square has been correctly rotated.

Here it is in a CodeSandbox: