Fork of HTML Starter

100%

Fork of HTML Starter

✓ Published0🌍 Public

Last edited Jul 27, 2021

Created on Jul 25, 2021

A static portrait of a face built from three SVG circles uses React components to render the scene. The large pink circle forms the head, while two smaller white circles serve as eyes, all positioned with hardcoded coordinates and stroke values. The code uses React 17.0.2 with ReactDOM to mount the SVG elements into the DOM, with dimensions and positions derived from JavaScript constants. No interactive behavior or data loading appears, as the visual is purely declarative and precomputed.

AI-generated description

Part 1 of let's make a face

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of HTML Starter

A minimalist React-driven SVG face built from three circles, showing a red head with two dark eyes on a 1000×500 canvas. The code uses React and ReactDOM to render the static `<svg>` elements, with the commented-out HTML version highlighting an alternative approach. It demonstrates basic declarative SVG composition within a React component, with no interactivity or data binding.

Ssubhan.samee5@gmail.com

93% match

Loading thumbnail…

Fork of HTML Starter

This example shows a simple face composed of three SVG circles: a large yellow circle for the head and two smaller black circles for eyes. It is built using React 17, with the SVG elements written directly in the HTML file. The visualization serves as a minimal starter template, demonstrating how to combine static SVG markup with React’s rendering capabilities. No interactive behavior or data binding is present, focusing solely on basic SVG shape composition within a React environment.

Ccasclark

92% match

Loading thumbnail…

Fork of HTML Starter

This example shows a static SVG face made of three circles—a large yellow head with a black outline and two smaller dark eyes—positioned on a 960 by 500 canvas. A React component renders the text "hello" into a separate HTML element, while the SVG markup is written directly in the HTML file. The code loads React and ReactDOM from CDN links and uses `ReactDOM.render` to mount the component, though the face itself is not generated through React.

Hhawkroad

92% match

Loading thumbnail…

Fork of HTML Starter

This example displays a simple, static SVG illustration of a face using two circles for eyes and a larger yellow circle with a black outline for the head. The rendering relies on raw SVG elements defined directly in the HTML body, with CSS used to remove page margins and hide overflow. The code snippet includes a script tag referencing React 17.0.2 via a CDN, though the visualization itself does not employ any React-specific functionality or dynamic data, instead presenting fixed geometry on a 960 by 500 canvas.

CcoldPen

91% match

Loading thumbnail…

Fork of Fork of HTML Starter 1

This example shows a static SVG face composed of three circles: a large yellow head and two smaller eyes. The rendering relies on React 16 via production UMD builds of `react` and `react-dom`, which are loaded from unpkg. The SVG markup is placed directly in the HTML body, while the accompanying `index.js` merely imports React and ReactDOM and logs the latter to the console. No interactive behavior or data-driven updates are present, as the visualization is entirely hard-coded in the markup.

Hharshulverma99@gmail.com

91% match

Loading thumbnail…

Fork of HTML Starter

This example uses React to render three static SVG circles on a 960×500 canvas, composing a simple face-like illustration. The code loads React and ReactDOM from UMD bundles via unpkg, then uses JSX to define SVG elements with attributes like `cx`, `cy`, and `r` for positioning and sizing. The HTML page includes a `<style>` block (currently empty) and a `bundle.js` script reference, though no dynamic behavior or data is demonstrated—the visualization is purely declarative and static.

EEnes Gök

90% match

Loading thumbnail…

Fork of HTML Starter

This example shows a simple face constructed from three SVG circles rendered inside a React application. It draws a large yellow circle as the head with two smaller black circles for eyes, all positioned using fixed coordinates derived from the container’s width and height. The code uses ReactDOM to render the SVG into the DOM, with D3 v7 loaded via a UMD script. The body margin is removed with CSS to create a full-bleed visualization.

Mmundembe

90% match

Loading thumbnail…

Fork of HTML Starter

This example presents a simple SVG face rendered with React and ReactDOM. The code defines a yellow circle with a black stroke to form the head, and two smaller circles for eyes, using fixed dimensions and coordinates within an SVG canvas. React elements are created using JSX and mounted to the DOM via `ReactDOM.render`, while the page loads React from unpkg CDN links. The visualization demonstrates basic SVG circle primitives and React component structure without interactive behavior or external data.

RRonanCurbe10

90% match