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)

2e251e75cb854888a732153bb19651f3

Shapes with SVG and CSS

0 stars1🌍 Public
YYUXUE LIU
Last edited Feb 20, 2020
Created on Feb 19, 2020
Forked from Hello VizHub

This example demonstrates how SVG and CSS can be used to draw and style basic geometric shapes, including circles, rectangles, lines, and a path. The SVG markup positions each shape within a 960x500 canvas, with a group transformation scaling the entire drawing. CSS classes, such as `.lines`, apply stroke properties and a line-join style to the path, while individual elements use inline attributes like `fill` and `stroke-width`. The code relies solely on standard SVG elements and CSS styling, with no external JavaScript libraries or data sources involved.

AI-generated description

Some random drawings