Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Shapes and Colors with SVG and CSS

Public visualization

Viewing a saved revision (read-only)

aee5dd8fca6845509aebe0e2718b7603

Shapes and Colors with SVG and CSS

0 stars0🌍 Public
PPhilRG
Last edited May 11, 2020
Created on May 11, 2020

This example demonstrates how basic SVG shapes—circles, rectangles, lines, and paths—can be styled directly with CSS classes and inline attributes. The scene shows grouped elements with shared fill and stroke properties, plus a separate group for lines with custom stroke widths and rounded joins. Rendered as an SVG document within an HTML page, it uses the SVG standard and CSS for presentation, with no JavaScript libraries involved. The code sets a 960×500 viewport and scales the entire group by 1.7.

AI-generated description

An example including some commonly used features of SVG.