I played with my JS wrapper for SVG and ended up with two diagrams for the algebraic proofs of the Pythagorean theorem.
There are more labels than necessary, but that's because I re-use the same triangle four times, each time rotated by another 90°.
Pretty convenient.
Here we have two ways of computing the area of the outer square: directly via the length of its sides a + b, or as the sum of the four triangles and the inner square. $$ \begin{align*} (a + b)^2 &= 4 \frac{ab}{2} + c^2\\ a^2 + \cancel{2ab} + b^2 &= \cancel{2ab} + c^2 \end{align*} $$
Now we re-arrange the same triangles into a second diagram.
Again, we have two ways of computing the area of the outer square: directly via the length of its sides c, or as the sum of the four triangles and the inner square with side lengths b - a. $$ \begin{align*} c^2 &= 4 \frac{ab}{2} + (b - a)^2\\ &= \cancel{2ab} + b^2 \cancel{- 2ab} + a^2 \end{align*} $$