{"version":"1.0","type":"rich","title":"Shapes with SVG ans CSS","description":"This example demonstrates basic SVG shapes—circles, rectangles, lines, and paths—styled through both inline SVG attributes and external CSS. It shows how CSS classes, such as `.lines`, override default SVG presentation properties like `stroke` and `stroke-width`, while `fill` and `stroke` attributes set directly on elements take precedence. The visualization is rendered entirely with SVG in static HTML, using no JavaScript libraries, and includes a group with a translation transform to position shapes collectively. The code also highlights inheritance of styling from parent `<g>` elements to child shapes.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/2450d94ae9f04710b2c56704ec8e402e?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}