Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Shapes with SVG and CSS

Public visualization

Viewing a saved revision (read-only)

7aaa3f65ec2b4262830953ffc7b84d66

Shapes with SVG and CSS

0 stars1🌍 Public
Ii202081
Last edited Mar 26, 2020
Created on Mar 26, 2020

This example demonstrates basic geometric shapes drawn with SVG, including circles, rectangles, lines, and a path, styled through CSS classes. The shapes are organized using SVG’s transform attribute for scaling and translation, while the CSS defines stroke properties and line joins for the line and path elements. The code uses raw SVG markup within an HTML page, with styles applied via a linked stylesheet. Shapes are positioned across a 960×500 canvas, with some elements inheriting fill colors from parent groups and others specifying fill attributes directly.

AI-generated description

A bare minimum HTML page.

See also React Starter.