This example demonstrates basic SVG shapes—a polygon, circle, and rectangle—styled with fill, stroke, and opacity transitions on hover. It uses the SVG API directly within an HTML document, applying CSS for styling and interactive effects like increased stroke width and full opacity. Line and path elements are also included, with the path using red stroke-linejoin and linecap. The layout is scaled via an SVG transform, and the shapes are grouped for shared positioning and color attributes.