Fork of Hello HTML

100%

Fork of Hello HTML

✓ Published0🌍 Public

Last edited Jul 22, 2024

Created on Jul 22, 2024

This example shows a static smiley face composed of three SVG circles: a large yellow face with black outlines and two smaller eyes. It serves as a simple introduction to rendering shapes with React by loading React 16.7.0 from a CDN and logging the library to the console. The SVG elements use explicit `cx`, `cy`, `r`, and `stroke-width` attributes to position the face and eyes on a 960×500 canvas, with CSS hiding overflow. The code does not include interactive behavior or dynamic data.

AI-generated description

Half way towards a smiley face

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Hello HTML

This example shows a static smiley face constructed from three SVG circles: a large yellow circle for the face and two smaller black circles for the eyes. Drawn with React and rendered inline in an HTML page, the SVG markup uses explicit pixel coordinates for the circle centers and radius values. The face outline uses a black stroke with a yellow fill, while the eyes are simple filled circles. The code loads React from a CDN but does not use any JavaScript logic or data processing; it is a purely declarative visual.

Aadi.toromanovic@outlook.com

97% match

Loading thumbnail…

Fork of Hello HTML

This example shows a static, hand-coded SVG smiley face with two eyes and a yellow circular head, rendered on a 960 by 500 canvas. The face is composed of three `<circle>` elements, with the head drawn using a yellow fill and a black stroke. The code uses React 17.0.1, loaded via a UMD script from unpkg, though the visualization itself is purely declarative SVG markup. The page applies a minimal CSS reset for margin and overflow, and the rendering approach is a direct use of SVG’s vector graphics API.

Mmattroark216

96% match

Loading thumbnail…

Fork of Hello HTML

This example shows a simple smiley face composed of three SVG circles: a large yellow circle with a black outline for the head and two smaller black circles for the eyes. The visualization is rendered statically on an SVG canvas. The code uses React 18.3.1 via a UMD script tag and a minimal JavaScript bundle that only imports React and logs it to the console, without implementing any interactive or dynamic behavior.

Aadt110149@gm.ntcu.edu.tw

96% match

Loading thumbnail…

Fork of Hello HTML

This example draws a simple smiley face using React and SVG. It renders three circles—a large yellow head with a black stroke, and two smaller black circles for eyes—positioned according to computed coordinates derived from the canvas dimensions. The code uses React 18.2 and ReactDOM to render an SVG element, with circle properties like `cx`, `cy`, `r`, and `stroke-width` defined directly in the JSX. The visualization is a static, procedural composition without external data.

Ggktb

96% match

Loading thumbnail…

Fork of Hello HTML

This example shows a simple smiley face drawn as a static SVG graphic, with a yellow circular face and two black-outlined eyes. The rendering uses raw SVG elements inside an HTML file, while the React library is loaded via CDN but not actually used for rendering. The code explicitly positions each circle with pixel coordinates, setting the face radius, stroke width, and eye placement. The SVG canvas is fixed at 960 by 500 pixels, and the face is centered. No data or interactivity is involved; it serves purely as a minimal React-with-SVG template.

Nnsingh1@student.nitw.ac.in

96% match

Loading thumbnail…

Fork of Hello HTML

This example displays a simple, static smiley face composed of three SVG circles: a large yellow circle for the head and two smaller black circles for the eyes. The React library is loaded via a UMD script and imported in JavaScript, though the visualization itself is hardcoded directly in the HTML markup rather than generated through React components. The page renders the graphic using inline SVG elements, with the body styled to remove margins and hide overflow.

Ssking8484

95% match

Loading thumbnail…

Fork of Hello HTML

This example shows a simple static smiley face drawn with SVG circles, with a yellow head and two black eyes, rendered inside an HTML page. It uses React 16.9.0 loaded via a CDN, though the script only logs the React object to the console and does not drive the DOM. The SVG drawing is hand-coded directly in the HTML, with the face centered on a 960 by 500 viewport. The page includes embedded CSS to remove margins and hide overflow, and the render relies on the `bundle.js` file for any JavaScript execution.

Ccheeter_Lee

95% match

Loading thumbnail…

Fork of Hello HTML

This example presents a basic smiley face graphic rendered as static SVG elements within an HTML page. The visualization consists of a large yellow circle with two smaller black circles positioned as eyes, all drawn using geometric primitives. The code uses React 18.3.1 loaded from unpkg, though the visible rendering relies directly on SVG markup rather than React-generated output. The page uses minimal CSS to remove margins and hide overflow, producing a clean 960×500 display.

CChristian Larrea

95% match