🌍 Public
Shapes and Colors with SVG and CSS
This example demonstrates how SVG shapes can be styled using both presentation attributes and CSS. It draws circles, rectangles, lines, and paths on a 960×500 canvas, with a transformation that scales the content. The code uses inline `fill` and `stroke` attributes, a grouped element with inheritance of stroke and fill properties, and CSS classes (`.lines`, `.lines path`) to control stroke color, width, and line joins. The SVG is embedded directly in HTML and styled with an external stylesheet.
AI-generated descriptionAn example including some commonly used features of SVG.
MIT Licensed








Comments
Sign in to join the discussion.