{"version":"1.0","type":"rich","title":"Shapes with SVG and CSS","description":"This example demonstrates basic geometric shapes rendered with SVG elements inside an HTML page, using CSS to style page layout. It shows a circle, a rectangle, a group containing both shapes, and a blue line, all positioned within a fixed 960x500 SVG viewport. The visualization relies on native SVG tags (`circle`, `rect`, `g`, `line`) directly in the markup, with attributes like `cx`, `cy`, `r`, `fill`, and `stroke` controlling appearance. A linked stylesheet (`styles.css`) manages body margins and overflow, while inline SVG attributes handle shape-specific formatting. No JavaScript libraries are used; the example purely demonstrates static SVG rendering.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/5e625d94d57b405789160094ed373768?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}