A smiley face drawn with D3.js v7 and React 18 uses SVG shapes to compose the yellow head, black outline, eyes, and a mouth created with the d3.arc path generator. The face is centered on a 960×500 canvas, with fixed pixel offsets and radii defining facial features. React renders the SVG elements, while D3’s arc function computes the curved mouth path based on specified start and end angles. The example demonstrates mixing React components with D3 geometric utilities for static, vector-based illustrations.