Fork of Hello HTML

100%

Fork of Hello HTML

✓ Published0🌍 Public

Last edited Sep 11, 2022

Created on Sep 5, 2022

This example displays a static yellow circle with two smaller black circles, evoking a simple face. Rendered as an SVG, the shapes are drawn directly within an HTML page. The code uses React to manage a separate heading element, while the visualizations are defined using raw SVG markup, including `<circle>` elements with explicit `r`, `cx`, `cy`, `fill`, and `stroke` attributes. The page loads React and ReactDOM from a CDN, and the SVG is output without additional data processing or interaction logic.

AI-generated description

A bare minimum HTML page.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Hello HTML

This example displays a static yellow circle with two smaller black circles positioned inside it, rendered as SVG shapes on an HTML page. The visualization uses raw SVG elements—circle tags with explicit radius, x- and y-coordinate attributes, and stroke styling—rather than any JavaScript-based data computation. The code imports React in index.js via bundle.js, though the rendering itself relies solely on declarative SVG markup embedded directly in the HTML file. No data source or dynamic behavior is present; the visualization simply demonstrates basic SVG shapes within a React project setup.

Ggraingames

96% match

Loading thumbnail…

Fork of Hello HTML

This example displays a static yellow circle with a black outline centered on an SVG canvas, accompanied by two smaller unfilled circles positioned to its upper left and right. It demonstrates a minimal React-based rendering approach, using React 18 and ReactDOM to create the main SVG element, while the remaining shapes are hardcoded directly in the HTML. The page loads React via UMD bundles and renders the primary circle through a React component, with the SVG markup splitting between compiled JavaScript and raw markup.

Rrjw25

95% match

Loading thumbnail…

Fork of Hello HTML

This example shows a simple yellow circle with two black dots, resembling a face, rendered as static SVG shapes on a 960×500 canvas. The visualization uses plain SVG elements directly in the `index.html` file, with circles positioned via `cx`, `cy`, and `r` attributes and styled with fill and stroke properties. It references the React library in a script tag and logs `React` to the console, but does not actually use React components or any D3 code. The page imports ReactDOM from unpkg but only relies on the built-in browser SVG rendering.

NNina Mainusch

95% match

Loading thumbnail…

Fork of Hello HTML

This example shows a simple, static face composed of two circles on a yellow background. A large yellow circle with a thick black stroke forms the head, while a smaller black circle positioned to the upper left represents an eye. The visualization is built using raw SVG elements within an HTML page, styled with CSS that removes page margins and hides overflow. It uses the React framework and relies on the browser's native SVG rendering, with the `cx`, `cy`, and `r` attributes defining the shapes.

Hhukbk

95% match

Loading thumbnail…

Fork of Hello html

This example shows a static yellow circle with a black border rendered in SVG, with two smaller unfilled circles positioned inside it to suggest facial features. The visualization uses React for component structure and renders SVG elements directly. The main circle is centered using computed width and height variables, while the smaller circles use hardcoded coordinates. The code includes both a direct SVG render in the HTML file and a React component approach in index.js, though only the direct SVG is visible on screen.

Ssukhmani0117

95% match

Loading thumbnail…

Fork of Hello HTML

This example shows a simple yellow circle with two smaller black circles arranged as a face, rendered directly in an SVG element. The visualization uses React 17, loaded from the unpkg CDN, though the code only logs the React object to the console without invoking any React components. The SVG circles are drawn with hardcoded coordinates and dimensions, using attributes like `cx`, `cy`, and `r`, while CSS sets the body to have no margin and hidden overflow. The outer circle includes a black stroke, defining the face’s outline against the default white background.

Tturk-i

95% match

Loading thumbnail…

Fork of Hello HTML

This example displays a simple yellow circle with two smaller black circles—a schematic face—rendered as static SVG elements on a 960x500 canvas. It pairs this hand-authored SVG with a React app that logs the React library to the console and attempts to render a "Hello JSX" heading via `ReactDOM.render`, though the component returns nothing. The code loads React 18.2.0 from a CDN and uses plain SVG circle elements, not D3 or other visualization libraries, highlighting a minimal integration of React with SVG markup.

HHannah Heejeong Lim

95% match

Loading thumbnail…

Fork of Hello HTML

This example displays a static yellow face composed of three SVG circles, with a black outline and two small circles for eyes, rendered on a 960 by 500 canvas. The page loads the React library from a CDN, and the code logs the React object to the console. The visualization is built directly with inline SVG markup in the HTML body, while a separate JavaScript file simply executes the same console log command, demonstrating a minimal integration of React alongside an SVG drawing.

Ssean.smith@artifact.io

95% match