Smiley Face

100%

✓ Published0🌍 Public

Last edited Jul 7, 2021

Created on Jul 4, 2021

A yellow smiley face rendered as an SVG circle with two smaller black circles for eyes sits centered on a 960×500 canvas. The page loads React 16.9 and ReactDOM 17.0.2 from unpkg, though the visualization itself uses only raw SVG elements—`<circle>` tags with explicit `cx`, `cy`, and `r` attributes—rather than React components. A script tag logs “React” and `index.js` imports React and ReactDOM, but no interactive behavior or data binding is present. The example demonstrates a static, hand-coded SVG composition embedded in an HTML file.

AI-generated description

A bare minimum HTML page.

MIT Licensed

Similar vizzes

Loading thumbnail…

Smiley Face-I

A static SVG smiley face appears on a yellow circle with a black outline, centered in a 960×500 viewport. The page loads React 17 and ReactDOM from a CDN, while the main `index.js` file defines a React component that renders a simple "Hello My world!" heading. However, the visible face is drawn directly in the HTML using an SVG `<circle>` element, not through React. The example demonstrates a minimal setup where HTML, SVG, and React coexist in a single page, with the actual smiley shape relying purely on static SVG markup.

Rrabinkmc

95% match

Loading thumbnail…

Smiley face

A yellow circle with a black stroke forms a smiley face, with two smaller filled circles placed as eyes. The entire graphic is rendered as static SVG elements inside an HTML page. The page loads React and ReactDOM from a CDN, though the visible drawing is done with direct SVG tags rather than through React components. The code uses the `circle` element with explicit `cx`, `cy`, and `r` attributes, and the main face has a `fill` of yellow and `stroke-width` of 5. The example demonstrates basic SVG shape composition in a minimal setup.

PPaula Donoso

94% match

Loading thumbnail…

Smiley Face

A smiling face rendered as a static SVG graphic uses React 17 and ReactDOM to mount an app, though the visible face is drawn directly in the index.html file with hardcoded circle elements. The yellow outer circle, two black eye circles, and implied curved mouth are laid out with explicit pixel coordinates on a 960×500 canvas. The code does not implement any interaction or data-driven logic; it simply outputs a fixed, pre-defined facial composition.

JJasprado23

94% match

Loading thumbnail…

Smiley Face

This example displays a simple smiley face drawn with basic SVG shapes—a yellow circle for the face and two smaller black circles for the eyes—centered on a 960 by 500 canvas. The page loads React and ReactDOM via CDN, though the visible graphic is produced directly with static `<circle>` elements in SVG markup, not through React rendering. The file also includes a separate `index.js` that logs ReactDOM and renders a "Hello JSX" heading, indicating the framework setup but not affecting the displayed smiley image.

CChaseRogers1027

94% match

Loading thumbnail…

Smiley Face

A static yellow smiley face rendered as SVG, drawn with three black-filled circles for eyes and a large yellow circle for the head, outlined with a black stroke. The example uses React 16.13.1, loaded via UMD, and relies solely on SVG primitives (circle) and inline CSS. No interactions or animations are present; fixed coordinate attributes position the elements on a 960×500 canvas.

Ffolbrich001

94% match

Loading thumbnail…

Smiley Face Part I

A static yellow smiley face rendered as three SVG circles—a large head and two smaller eyes—appears on a 960-by-500 canvas. The page loads React and ReactDOM from a CDN, though the visible drawing is plain SVG markup in the HTML, not React-generated. The code includes a minimal `index.js` that imports React but does not render any component, so the smiley face is purely declarative SVG without interactive behavior.

XXinhuiyu Liu

93% match

Loading thumbnail…

SmileyFaceI

A static smiley face rendered as SVG shows a yellow circle with black outline and two smaller circles for eyes. The HTML page defines the graphic directly with hardcoded circle coordinates, while a separate React component in `index.js` merely displays "Hello JSX" using `ReactDOM.render`. The project uses React 16.7.0 from a CDN, but the visible face itself relies only on plain SVG elements without dynamic data or interaction.

EEric Van Horenbeeck

93% match

Loading thumbnail…

Smiley Face Part I

A static smiley face rendered in SVG appears on a yellow circular head with black stroke, featuring two black eyes and no mouth. The visualization uses React 17.0.2 loaded via UMD script, with hardcoded circle elements placed at fixed coordinates on a 960x500 canvas. The example demonstrates basic SVG rendering through React’s createElement or JSX transformation, though no interactive behavior or data-driven updates are present.

TTegar Dimas Pradana

93% match