Fork of Hello HTML

100%

Fork of Hello HTML

✓ Published0🌍 Public

Last edited May 13, 2022

Created on May 13, 2022

This example demonstrates a static SVG face constructed from three circles—a large yellow head and two black eyes—positioned in a fixed layout, alongside a separate React-controlled heading. The SVG elements are defined directly in the HTML with explicit attributes for coordinates, radius, fill, and stroke. The React library (react@18.1.0) and ReactDOM (react-dom@17.0.2) are loaded via UMD scripts to render a simple “Hello World” `<h1>` element into the root div, while the SVG remains independent of React’s rendering. The code uses plain SVG markup, not D3 or canvas APIs.

AI-generated description

A bare minimum HTML page.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Hello HTML

This example shows a static SVG illustration of a face composed of three circles—two yellow eyes and a large coral circle—set on a light pink background, alongside a React-rendered heading. The page combines React 17 and react-dom 17 to inject an `<h1>` element into a root div, while the SVG markup resides directly in the HTML. The code demonstrates a minimal React setup with a plain SVG drawing, rendering shapes without interaction or data transformation.

HHimanshu Bisht

94% match

Loading thumbnail…

Fork of Hello HTML

This example combines a React-rendered “Hello JSX” heading with a static SVG face drawn directly in HTML. The SVG contains three circles—a large yellow outline and two smaller black eyes—created with basic shape elements. React 16.9.0 and ReactDOM render the JSX component into a root div, while the SVG sits outside the React tree, using fixed coordinates and no data binding. The page demonstrates a minimal integration of React with hand-coded SVG markup.

Ccasclark

94% match

Loading thumbnail…

Fork of Hello HTML

This example shows a simple face-like graphic composed of three SVG circles: one large yellow circle with a black stroke for the head, and two smaller unfilled circles for the eyes. It demonstrates the most basic structure of an SVG visualization within an HTML page, using React from the UMD build loaded via a script tag. The code renders the SVG directly in the body without any React components or JavaScript execution beyond a console log of the imported React object. The rendering approach is static SVG, with no data binding or interaction.

MMeghana Bangari

94% match

Loading thumbnail…

Fork of Hello HTML

This example shows a simple, static SVG face comprised of three circles: a large yellow head with a cyan outline and two smaller black eyes. It serves as a minimal demonstration of embedding SVG graphics directly within an HTML page. The page structure is built with basic HTML, while the React library is loaded via a script tag from the unpkg CDN. However, the rendering itself relies solely on standard SVG elements (circle) and does not utilize any React components or dynamic data.

Eeatenmoth

94% match

Loading thumbnail…

Fork of Hello HTML

This example shows a simple static SVG face composed of three circles: a large yellow head with black outlines and two smaller black-outlined eyes. The visualization is rendered using a fixed 960x500 SVG element directly in the HTML body, while react and react-dom are loaded via UMD builds from unpkg. The React component in index.js mounts to the root div, though the actual drawing is handled by the raw SVG markup rather than JSX or d3. The page includes an embedded YouTube video, but the visualization itself remains non-interactive.

MMarko Sanković

94% match

Loading thumbnail…

Fork of Hello HTML

This example shows a static SVG face constructed from three yellow and black circles, paired with a React-rendered "Hello JSX" heading. The HTML page loads React 16.7.0 via UMD scripts and uses `ReactDOM.render` to mount the heading into a root div. The face itself is drawn directly with SVG `<circle>` elements in the markup, while the body uses inline CSS to remove margins and hide overflow. No JavaScript interacts with the SVG elements; the visualization is purely declarative HTML.

FFarheen Oomatia

94% match

Loading thumbnail…

Fork of Hello HTML

A static SVG face rendered with React and raw SVG elements. The code uses React to manage the SVG structure, drawing a yellow circle for the face, black strokes for borders, and two smaller circles for eyes. The example demonstrates basic SVG shapes and React integration, with the SVG output displayed directly in the HTML page. It uses React 16.9.0 from a CDN and relies on native SVG attributes like `cx`, `cy`, `r`, and `fill`.

11G4S

93% 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

93% match