{"version":"1.0","type":"rich","title":"Shapes and Colors with SVG and CSS","description":"This example demonstrates the rendering of primitive shapes—circles, rectangles, lines, and paths—using SVG elements with both inline presentation attributes and external CSS styling. The scene shows how default black fills appear on the first row, then explicit fill colors like red and green on the second, and a third group applies a light blue fill with a black stroke via a parent `<g>` element. CSS classes on the line and path elements set stroke colors, dash styles, and rounded line joins and caps. The SVG is embedded directly in HTML, with the CSS file defining page margins and shape-specific properties. The markup uses explicit coordinates and transforms to position the shapes.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/a11fbad061e44b6181a8640445a045c6?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}