Skip to main content
100%

SVG with CSS

✓ Published0🌍 Public
SShizraBurney
Last edited Sep 18, 2023
Created on Sep 18, 2023
Forked from HTML Starter

This example demonstrates how CSS styling can be applied to SVG elements within a React-based visualization. The page renders multiple shapes—circles, rectangles, and lines—organized into groups, with some using inline attributes and others relying on classes from an external stylesheet. The `.lines` class sets black stroke and width, while a path inside receives a specific blue stroke color with rounded joins. Using the SVG API directly in HTML, the code applies transforms like scaling and translation to reposition groups, showcasing the interplay between SVG presentation attributes and CSS rules.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.

MIT Licensed

Similar vizzes