This example demonstrates how to construct basic SVG shapes—circles, rectangles, lines, and paths—using a static HTML page and CSS. The visualization shows how SVG attributes like `fill`, `stroke`, `stroke-width`, and the `<g>` element group shapes to apply shared styling, with initial shapes appearing in default black and then colored red and green. A `<g>` group applies a light blue fill and black stroke to its contents, and another group applies a thick black stroke to a line and path. The code uses raw SVG in `index.html` with a linked `styles.css` for page-level body styling, with no JavaScript involved.