Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Let's make a face! Tutorial

Public visualization

Viewing a saved revision (read-only)

30c3f3556130407eb48f73fa8acd2bb0

Let's make a face! Tutorial

0 stars0🌍 Public
MMichipeachy
Last edited Jan 11, 2021
Created on Jan 9, 2021

This example shows a simple animated face built with SVG shapes, including a pink circle head, brown eyes, and a mouth created using an SVG arc path. A group containing the eyebrows transitions vertically up and down in a repeating two-second cycle. The code uses D3 v6 selections and the `d3.arc` helper to generate the mouth path, with SVG attributes for positioning and styling. Rendering is entirely in SVG with D3 transitions driving the eyebrow animation.

AI-generated description

An example including some commonly used features of SVG.