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)

c19828aded3b4fc6bc1019a8984b79cc

Shapes and Colors with SVG and CSS

0 stars4🌍 Public
OOsekovS
Last edited Aug 17, 2020
Created on Aug 11, 2020

An SVG face centered on a 960×500 canvas uses D3 v5’s selection and arc APIs to build its features. Green and greenyellow circles form the head and eyes, while two rectangles animate as eyebrows via chained `transition().duration(2000)` calls, moving up and down over four seconds. A mouth path is generated with the `arc` function, using inner and outer radii with a half-turn angular sweep. The example demonstrates common SVG shapes and CSS styling within D3’s declarative, animation-capable rendering.

AI-generated description

An example including some commonly used features of SVG.