cptamang

@cptamang·2 public vizzes

Fork of Smiley Face Part II

This example shows a full-window smiley face rendered as a yellow circle with two eyes, dynamically sized to match the browser viewport. The face is drawn as an SVG, with the face positioned at the center and the eyes offset symmetrically from it. It uses React to define the SVG elements, with ReactDOM rendering the component into the page. The code relies on `window.innerWidth` and `window.innerHeight` to size the face, and the mouth is not implemented, only the head and eyes are visible.

Jun 9, 2021

Loading thumbnail…

Fork of Let's Make a Face Part I

This example shows a simple smiley face built from SVG circles: a large yellow head with a black stroke, two smaller circles for eyes, and an implied mouth in progress. It renders in an SVG container using hard-coded coordinates for layout, with no interactive behavior. The code uses basic SVG elements like `<circle>` and inline styling, and mentions center positioning and eye offset in comments to guide placement. A linked video tutorial accompanies the illustration.

Jun 9, 2021