{"version":"1.0","type":"rich","title":"Shape with SVG and CSS","description":"This example demonstrates how to compose basic geometric shapes—circles, lines, paths, and rectangles—within a single SVG canvas. The code uses React and SVG elements with inline styling and CSS classes applied via the `styles.css` file. It shows how CSS can selectively style SVG groups, such as applying stroke properties to the `.rect` class, while other shapes rely on direct presentation attributes. The visualization presents a static arrangement of colored shapes and lines without interactive behaviors.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/0499ae8c1ddb429786914dff7c903228?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}