Fork of HTML Starter

100%

Fork of HTML Starter

✓ Published0🌍 Public

Last edited Aug 6, 2022

Created on Aug 6, 2022

This example displays a yellow circle with two black circles, resembling a face, rendered as static SVG elements over a 960 by 500 canvas. The page also mounts a separate React component that renders a large "Hello" message into a root div using ReactDOM. The React production UMD builds are loaded from unpkg, while the SVG shapes are drawn directly in the markup. The code demonstrates a minimal integration of React 18 for DOM content alongside raw SVG for fixed visual elements.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

Similar vizzes

Loading thumbnail…

Fork of HTML Starter

This example shows a simple yellow circle with a thick black outline and two smaller unfilled circles, positioned to resemble a face. It renders directly as SVG elements inside the HTML body, using hard-coded coordinates and radii. The page includes React and ReactDOM scripts from unpkg, though the React code only logs the ReactDOM object to the console. Styling is minimal, hiding page margins and centering a large text message that is not otherwise used.

Aarinozavr

94% match

Loading thumbnail…

Fork of HTML Starter

This example shows a simple yellow circle with two smaller black circles positioned inside it, forming a basic face-like shape on an SVG canvas. The code demonstrates a minimal React setup by loading the React library via a CDN and logging the React object to the console. It combines raw SVG elements with inline JavaScript, using React 17 and standard SVG circle attributes for rendering. The example serves as a starting point for exploring how React can coexist with static SVG markup in a bare HTML page.

Rrmanonl

94% match

Loading thumbnail…

Fork of HTML Starter

This example shows a simple yellow circle with two black eyes, resembling a basic face, rendered on a 960 by 500 pixel SVG canvas within an HTML page. The drawing uses raw SVG elements—a central `<circle>` for the face and two smaller `<circle>` elements for the eyes—with hard-coded coordinates and styling via CSS. The page loads the React 18.2.0 UMD libraries and includes a JavaScript file that logs the `ReactDom` object, demonstrating a minimal setup for integrating React with static SVG graphics.

Kkousikgvs

94% match

Loading thumbnail…

Fork of HTML Starter

This example displays a simple yellow circle with a black outline centered on an SVG canvas, flanked by two smaller black circles representing a stylized face. The page is a bare-bones HTML document that loads React 16.7.0 from a CDN but does not use any React components or methods. Instead, it relies on plain SVG elements—circle, cx, cy, r, fill, and stroke—to render the shapes, while CSS classes control font styling for an empty message area. The rendering approach is direct, static SVG without data binding or interaction.

JJake

94% match

Loading thumbnail…

Fork of HTML Starter

This example shows a simple yellow circle with a black outline and two smaller black circles positioned inside it, representing a face. The code uses React 18 to render the SVG directly into the DOM, with the entire visualization defined as static SVG elements. It relies on the ReactDOM API for rendering, while the SVG markup includes explicit coordinates for the face’s features. No interactive behavior or data fetching is present, making it a minimal starter template for React-based SVG visualizations.

AAndré Thiago Netto

94% match

Loading thumbnail…

Fork of HTML Starter

This example renders a simple face using React and SVG, displaying a yellow circle with two smaller black circles as eyes against a 960×500 canvas. The code imports React and ReactDOM, defines constants for dimensions and positions, and uses JSX to construct SVG circle elements with props like `r`, `cx`, `cy`, and `stroke-width`. It leverages ReactDOM.render to mount the component into the DOM, demonstrating a minimal React-based data visualization with hardcoded geometric values.

GGyanashree Giri

93% match

Loading thumbnail…

Fork of HTML Starter

This example presents a simple SVG face rendered with React and ReactDOM. The code defines a yellow circle with a black stroke to form the head, and two smaller circles for eyes, using fixed dimensions and coordinates within an SVG canvas. React elements are created using JSX and mounted to the DOM via `ReactDOM.render`, while the page loads React from unpkg CDN links. The visualization demonstrates basic SVG circle primitives and React component structure without interactive behavior or external data.

RRonanCurbe10

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

93% match