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)

d71eb540c5c8450f9b2e6ecbedf632d2

Shapes with SVG and CSS

0 stars1🌍 Public
Nnick-yadav
Last edited Aug 8, 2020
Created on Aug 6, 2020
Forked from HTML Starter

This example shows a basic SVG scene composed of geometric shapes—circles, rectangles, lines, and a path—styled with CSS classes. It demonstrates how SVG elements inherit properties like stroke and fill from CSS, with specific overrides for path elements. The code uses raw SVG tags (circle, rect, line, path) inside a scalable group, with transform attributes for positioning. CSS in style.css applies global layout and stroke styles, while inline HTML contains the SVG structure. Rendering occurs entirely in the browser via standard SVG and CSS, with no additional JavaScript libraries involved.

AI-generated description

A bare minimum HTML page.

See also React Starter.