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)

8f7d48a182f7410baf1197798a2bce05

Shapes with SVG and CSS

0 stars0🌍 Public
Ccindy203cc
Last edited Sep 18, 2022
Created on Sep 17, 2022
Forked from HTML Cars Report

This example demonstrates how to draw basic SVG shapes—circles, rectangles, lines, and paths—inside an HTML page. It shows how to style these shapes with inline attributes and external CSS, including the use of classes like `.lines` to group styling rules. The code uses no libraries or APIs; it relies solely on raw SVG markup and CSS. The rendering approach is directly visible in the `index.html` file, which contains a single `<svg>` element with a `transform` attribute to scale the content.

AI-generated description

An example showing the capabilities of VizHub:

  • Loads D3 via UNPKG.
  • Demonstrates use of import from "d3".
  • Demonstrates use of import from local ES6 modules.