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)

2a3198611ac941d0bbc1546623dcb046

Shapes with SVG and CSS

0 stars0🌍 Public
Ppcbt1125
Last edited Nov 2, 2019
Created on Nov 2, 2019

This example demonstrates basic SVG shape rendering and styling using CSS. It displays circles, rectangles, lines, and paths on a 960x500 canvas, with shapes scaled and translated using SVG transform attributes. The code uses raw SVG elements like `<circle>`, `<rect>`, `<line>`, and `<path>`, while CSS classes such as `.lines` control stroke properties. Colors and fills are applied both inline and through stylesheets, showcasing how SVG and CSS combine to create static vector graphics.

AI-generated description

An example showing the capabilities of VizHub.