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 stars2🌍 Public
TTomas S
Last edited Nov 13, 2019
Created on Nov 13, 2019

This example demonstrates basic SVG shapes and CSS styling in a static visualization. It shows circles and rectangles with varying fill colors, stroke properties, and a line with a polyline path, all grouped and transformed within an SVG canvas. The code uses raw SVG elements like `circle`, `rect`, `line`, and `path`, along with CSS classes to control stroke appearance and line joins. A `<g>` element applies a translation transform, and inline attributes set fill and stroke values directly. The rendering is entirely client-side via SVG, with no external JavaScript libraries or data sources.

AI-generated description

An example including some commonly used features of SVG.

Comments

Sign in to join the discussion.

MIT Licensed