🌍 Public
Viewing a saved revision (read-only)
f5d7ac4af0a544f0ac6d882b5f016e3d
Rectangle Hover
A single red rectangle with a thick black stroke sits centered on a white SVG canvas. When hovered, the rectangle smoothly transitions over four seconds to a purple fill with a much wider stroke. The example demonstrates CSS transitions applied directly to SVG shapes, using the `rect` element with `transition` and `:hover` styles. The rendering relies entirely on native SVG and CSS, with no JavaScript libraries involved beyond a placeholder `console.log`.
AI-generated descriptionA demonstration of SVG shapes