🌍 Public
Viewing a saved revision (read-only)
53b174277b744582bf6050d284e00485
Shapes with SVG and CSS
This example demonstrates how SVG shapes—circles, rectangles, lines, and paths—can be styled using CSS. It shows the default black fill, explicit fill attributes like `fill="red"`, and inherited properties from a `<g>` element with `fill="blue"` and `stroke="black"`. The `.lines` class applies stroke styling to line and path elements, with a red path using `stroke-linejoin: round`. The visual hierarchy progresses from unstyled shapes to attribute-based coloring, then to CSS class overrides, all within a scaled and translated SVG coordinate system.
AI-generated descriptionA bare minimum HTML page.
See also React Starter.