Fork of Hello HTML

100%

Fork of Hello HTML

✓ Published0🌍 Public

Last edited Feb 8, 2024

Created on Feb 8, 2024

This example displays a static SVG face composed of three circles—two small eyes and one large yellow head with a black outline—rendered inside a React application. The visualization is drawn directly in the `index.html` file using SVG markup, while the React component `App.js` renders a simple text heading. The code uses React 18.2.0 and the `createRoot` API from `react-dom/client` to mount the application. The SVG output is embedded in the HTML body alongside the React-generated content, making the face the primary visual element.

AI-generated description

A bare minimum HTML page.

MIT Licensed

Similar vizzes

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

93% match

Loading thumbnail…

Fork of Hello HTML

This example demonstrates a React component that renders a simple SVG face with a yellow circle, two black eyes, and a black stroke. The code uses React and ReactDOM to mount an `<App />` component into a `#root` div, while the commented-out SVG markup shows the intended geometric shapes. The actual rendered output displays only the text "Hi," as the SVG code is not active. The example highlights how a React-based visualization can be structured, using standard SVG elements like `<circle>` with `cx`, `cy`, and `r` attributes, though the live demo currently shows no graphical output.

SSimon

93% match

Loading thumbnail…

Fork of Hello HTML

This example displays a static SVG face composed of three circles on a yellow background, with two smaller black circles serving as eyes beneath a larger outlined circle. It demonstrates a minimal React integration by loading React 18.2.0 from a CDN and logging the `React` object to the console. The visualization uses hand-coded SVG elements with fixed coordinates and stroke properties, rendering a simple, non-interactive figure without any data binding or animation.

Ssunyixia025@gmail.com

93% match

Loading thumbnail…

Fork of Hello HTML

A static SVG face is drawn directly in the HTML, with a yellow circle for the head and two black circles for eyes. The page uses React 16.9.0 via UMD builds for the app structure, but the visual rendering is plain SVG markup with hardcoded coordinates and stroke properties. The example demonstrates mixing React's declarative component model with traditional SVG elements, though the React component in `index.js` is empty and the face is entirely defined in the HTML file.

GGaratuza

93% match

Loading thumbnail…

Fork of Hello HTML

A simple SVG face composed of three circles—a large yellow head with black outline and two smaller eyes—renders statically within a 960 by 500 viewport. The page loads React 17 from a CDN and includes an inline `index.js` that only logs the React object, while the SVG markup appears directly in the HTML body. No interaction or animation occurs; the example demonstrates basic declarative vector graphics embedded in a web page.

SSLO-j

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

93% match