Shapes with SVG and CSS
This example shows how to create basic geometric shapes—circles and rectangles—using SVG elements styled with CSS. The code defines two identical groups of shapes, each translated vertically using SVG’s `transform` attribute, rendering blue circles and green rectangles on a 960×500 canvas. It uses plain SVG markup within an HTML page, with CSS (via `styles.css`) controlling the page layout and margins, while no JavaScript or external library is required. The rendering approach relies entirely on static SVG and CSS, demonstrating fundamental vector graphics in a bare-bones React-free setup.