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*}
$$