{"version":"1.0","type":"rich","title":"Shapes with SVG and CSS","description":"This example demonstrates how SVG shapes—circles, rectangles, lines, and paths—can be styled using CSS. It shows the default black fill, explicit fill attributes like `fill=\"red\"`, and inherited properties from a `<g>` element with `fill=\"blue\"` and `stroke=\"black\"`. The `.lines` class applies stroke styling to line and path elements, with a red path using `stroke-linejoin: round`. The visual hierarchy progresses from unstyled shapes to attribute-based coloring, then to CSS class overrides, all within a scaled and translated SVG coordinate system.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/decbd3f9446d4b4dba87b2cf6ce7cb8a?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}