{"version":"1.0","type":"rich","title":"Shapes with SVG and CSS","description":"This example demonstrates how to position and style basic SVG shapes—circles, rectangles, lines, and a path—using inline attributes and CSS classes. The code uses raw SVG elements within an HTML page, with a global stylesheet controlling the appearance of the line group and path, including stroke color and line join style. Shapes are grouped and transformed using SVG’s `translate` and `scale` attributes, showing how to compose complex scenes without external libraries. The example serves as a tutorial for manipulating SVG geometry and CSS styling directly.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/b878836f69174a7284182451e9c71dd6?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}