🌍 Public
Viewing a saved revision (read-only)
e831cb64420e4745ab512172725c2af6
Shapes with SVG and CSS
This example demonstrates multiple ways to style SVG shapes using both inline attributes and CSS classes. It shows circles and rectangles arranged in a grid, with some shapes using default black fills and others explicitly colored red and green via fill attributes. The visualization also includes a grouped set of shapes with a light blue fill and black stroke, plus a polygon path with rounded line joins defined in the stylesheet. The code leverages React, SVG elements like circle, rect, line, and path, along with CSS transform properties to scale and translate the entire composition.
AI-generated descriptionReact Starter code.