{"version":"1.0","type":"rich","title":"Shapes with SVG and CSS","description":"This example demonstrates how SVG shapes and CSS can combine to create a layered visual composition. The code uses raw SVG elements—circles, rectangles, lines, and a path—positioned within a `<g>` transform, with some shapes colored via inline `fill` attributes and others styled through CSS classes like `.lines`. A translated group adds a second set of shapes with custom colors and strokes, while `transform=\"scale(0.9)\"` modifies the overall rendering. The result highlights basic vector drawing without any JavaScript libraries, relying solely on native SVG markup and external stylesheet rules.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/6669e93ef0a44c29ac2f9d931ff05ccb?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}