A demonstration of basic SVG shapes includes a circle, line, and rectangle, each styled with stroke and fill. The rectangle uses a CSS transition and hover effect to change its color and stroke width. The example relies on SVG rendering with HTML and CSS, not on JavaScript libraries. The circle and line use default black fill and stroke, while the rectangle has a blue fill. The hover interaction, defined with `rect:hover` and a CSS transition, triggers visual feedback on the rectangle only.