Skip to main content
SimilarExport ZIP
100%

Fork of Let's Make a Face Part II

✓ Published0🌍 Public
MMohamed
Last edited Aug 25, 2025
Created on Aug 25, 2025

This example shows a fixed SVG face with two large eyes inside a yellow circular head. The face is rendered statically without any interactive behavior. The implementation uses React 16.9.0, loaded via a UMD build from unpkg, and plain SVG elements with hardcoded coordinates and stroke widths. The code logs the React object to the console but does not apply any data-driven or dynamic updates, making it a minimal demonstration of combining React with SVG markup.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Let's Make a Face Part I

This example shows a simple, static SVG face built with React, consisting of a yellow circle for the head and two smaller black circles for the eyes. The code defines the canvas dimensions, center points, eye offset, eye radius, and stroke width as variables, then uses React’s `ReactDOM.render` to compose the SVG elements with computed coordinates. The rendering relies on React 18.3.1 and ReactDOM, drawing the shapes directly as SVG circles without any data source or interaction.

AAnthony Le
94% match
Loading thumbnail…

Fork of Let's Make a Face Part I

A simple SVG face renders two black circles as eyes over a larger yellow circle, drawn directly in the HTML. The example uses React 18 via UMD, logging the React object to the console on load. No data source is present; the static shapes are hardcoded in the markup. The page loads a compiled `bundle.js`, though the main script only demonstrates React’s availability in the browser.

Oobaidallah alqurshi
94% match
Loading thumbnail…

Fork of Let's Make a Face Part I

A static SVG face built with React and JSX. It shows a yellow circle with a black stroke, two black eye circles positioned with hard-coded coordinates, and no mouth, as the README notes it is only halfway to a complete face. The code uses React 17 from a UMD build and draws directly with SVG elements like `<circle>`, setting positions and sizes absolutely. The example demonstrates simple, non-interactive geometric composition rather than data-driven visualization.

JJulian Huarachi
94% match
Loading thumbnail…

Fork of Let's Make a Face Part I

A static SVG face built with React elements, featuring a yellow circular head with black stroke and two unfilled eyes. The markup directly encodes a 960 by 500 viewBox, positioning the head at center, and places windows for eyes using hardcoded coordinates. It demonstrates hand-authored SVG in JSX, where the body imports React and logs it to the console, while the index.html loads production React and ReactDOM from a CDN. The example serves as an instructional starting point for constructing shapes.

RRohan s
94% match
Loading thumbnail…

Fork of Let's Make a Face Part I

A static SVG face built from three circles—a yellow head and two eyes—is rendered in a 960 by 500 viewport. The example uses React 17 to mount the markup, though the SVG is hard-coded in the HTML, with no interactive or animated behavior. It demonstrates a minimal, declarative approach to compositing basic shapes in a browser.

AAimiton Isaiah Oluwatobi
93% match
Loading thumbnail…

Fork of Let's Make a Face Part I

A minimal React example plots a yellow circle face with two black eyes on an SVG canvas. It uses React 18's UMD build from unpkg and directly renders SVG elements for the face and eyes. The code calculates eye positions relative to the canvas center and face radius, demonstrating coordinate placement within an SVG viewBox. This static composition shows how to create a basic smiley face without interactivity or animations.

AArkaporn Poonkwan
92% match
Loading thumbnail…

Fork of Let's Make a Face Part I

A static SVG face with a yellow circular head and two black eye circles is drawn directly in the HTML body, while a React app renders a separate "Hello JSX" heading into a root div. The face uses fixed coordinates for the circles, with the head centered at (480, 250) and eyes offset horizontally. The code loads React and ReactDOM from CDN and relies on the bundle.js script for the React component, though no interactive behavior is demonstrated.

JJustin Olson
92% match
Loading thumbnail…

Fork of Let's Make a Face Part I

A static face is drawn as two large black-outlined yellow circles for the head and eyes, centered on an SVG canvas. The rendering uses raw SVG elements (`circle` with `fill`, `stroke`, and `stroke-width`) declared directly in the HTML body, despite the presence of React and ReactDOM libraries in the source. The code includes a placeholder JavaScript file that merely logs to the console, leaving the face purely declarative and non-interactive.

SSagar Saxena
92% match