{"version":"1.0","type":"rich","title":"SVG Animations using CSS transitions","description":"A single red rectangle with a black border sits centered in an SVG canvas. The example demonstrates CSS transitions applied directly to SVG elements, specifically the `rect` element. When hovered, the shape smoothly animates its `fill` from red to green and its `stroke-width` from 20 to 100 pixels over a 3000ms duration. The code uses plain CSS within a `<style>` block, targeting the SVG element’s `transition` property, with no JavaScript or external libraries involved. The rendering is pure SVG markup contained in an HTML file.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/1355a88c2c704e74aef3ad61c8d6da2a?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}