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)

ee2781e15a974948a521ed0807e71eec

Shapes with SVG and CSS

0 stars1🌍 Public
VVivian Peng
Last edited Sep 28, 2020
Created on Sep 28, 2020
Forked from HTML Starter

This example demonstrates basic geometric shapes—circles, rectangles, and a line—arranged within an SVG canvas. It shows how SVG elements can be styled directly via attributes like `fill`, `stroke`, and `stroke-width`, and how a grouping element `<g>` applies these styles collectively to its children. The rendering relies on raw SVG markup embedded in an HTML page, with a linked CSS stylesheet controlling page layout and overflow. The code uses core SVG APIs for drawing, without additional JavaScript libraries or data sources.

AI-generated description

A bare minimum HTML page.

See also React Starter.