Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Shapes and Colors with SVG and CSS

Public visualization

Shapes and Colors with SVG and CSS

0 stars0🌍 Public
BBrett Cunningham
Last edited Nov 15, 2019
Created on Nov 15, 2019

This example demonstrates basic SVG shapes—circles, rectangles, lines, and paths—positioned and styled through SVG attributes and CSS classes. It shows how shapes inherit fill and stroke properties from a parent `<g>` element, how transforms like `scale` and `translate` reposition entire groups, and how CSS rules can assign stroke color and width to line elements. The code uses raw SVG markup and linked CSS styles, with no JavaScript or external visualization libraries.

AI-generated description

An example including some commonly used features of SVG.

Comments

Sign in to join the discussion.

MIT Licensed