This example renders a simple yellow face with two eyes and a smiling mouth as SVG elements in a React application. The face and eyes are drawn using plain SVG `<circle>` elements, while the mouth is generated with D3’s `arc()` generator, which produces a path with specified inner and outer radii and angular ranges. The components are split across multiple files—`FaceCircle.js`, `Eyes.js`, and `Mouth.js`—and imported into a central `index.js` that sets the viewport dimensions and positions the face in the center. React 17 manages the component hierarchy, and D3 v6 supplies the arc geometry.