{"version":"1.0","type":"rich","title":"Shapes with SVG and CSS","description":"This example demonstrates how SVG shape elements are styled using both presentation attributes and CSS. It shows circles, rectangles, lines, and a path, with solid colors, strokes, and transforms applied. The code uses vanilla SVG markup with CSS rules from an external stylesheet, including a `.lines` class to set stroke properties. A `<g>` element applies `fill`, `stroke`, and `stroke-width` as inherited attributes, while another group uses a `translate` transform. The example highlights how CSS and SVG attributes interact to control visual appearance.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/a94357f37bb744ffb18550054cc7c6cc?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}