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)

b9bc2a2a12ae4cfba5f28d6c3d5aa10a

Shapes with svg and CSS

0 stars0🌍 Public
Rrgarimella-viz
Last edited Jun 21, 2020
Created on Jun 21, 2020

This example demonstrates how to draw basic SVG shapes—circles, rectangles, lines, and paths—and style them using CSS classes. The shapes are nested inside a scaled and translated SVG group, showing how transforms affect their positions. The code uses raw SVG elements within an HTML page and applies styling through an external stylesheet, where the `.lines` class sets stroke color and width, and a descendant selector customizes the path's line join.

AI-generated description

A bare minimum HTML page.

See also React Starter.