{"version":"1.0","type":"rich","title":"CSS Transitions","description":"This example demonstrates CSS transitions applied to SVG elements, showing how a yellow rectangle scales, changes fill color, and alters stroke properties when hovered. The rectangle’s transition is defined for fill (0.5s), transform (1s), stroke (1s), and stroke-width (2s), with a hover state triggering red fill, 1.2× scale, and thicker green stroke. The code uses a plain HTML page with inline CSS and JavaScript, embedding an SVG element directly in the markup. The SVG has a grey background with a red border, centered on a pink page.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/3f37374c44464746a258f9ef9b9e7fcf?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}