Fork of Fork of Fork of HTML Starter 1

100%

Fork of Fork of Fork of HTML Starter 1

✓ Published0🌍 Public

Last edited Aug 3, 2025

Created on Aug 3, 2025

Forked from Fork of Fork of HTML Starter 1

This example shows a static SVG composition of a yellow rectangle containing two black squares, rendered inside an HTML page. The visualization relies on hardcoded SVG shapes defined directly in the markup, with React and ReactDOM loaded via CDN but only used to log the ReactDOM object to the console. The page imports React 16.14.0 and ReactDOM from unpkg, while the SVG elements use basic geometric attributes like x, y, width, and fill to create the simple layout.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of HTML Starter

This example shows a simple static SVG composition: a large yellow circle with a black outline, accompanied by two smaller unfilled circles positioned symmetrically inside it. The visualization demonstrates basic SVG shape rendering within an HTML page. The code uses an SVG element with explicit width and height attributes, styling circle elements with fill, stroke, and stroke-width properties. It imports React and ReactDom from the provided JavaScript file, though the rendering itself relies purely on raw SVG markup in the index.html file, not on React's component system.

MMd Alif

92% match

Loading thumbnail…

Fork of HTML Starter

A yellow circle with a black outline sits centered on a 960 by 500 SVG canvas, with two smaller unfilled circles positioned as eyes. The static visualization is rendered directly in an HTML page using SVG markup, while React is loaded via a CDN but not used to generate the graphic. The page imports React and ReactDOM from unpkg, though the drawing itself is hand-coded in the markup, demonstrating a simple static SVG composition within a React starter template.

Uutubun

91% match

Loading thumbnail…

Fork of Fork of HTML Starter 1

This example shows a static SVG face composed of three circles: a large yellow head and two smaller eyes. The rendering relies on React 16 via production UMD builds of `react` and `react-dom`, which are loaded from unpkg. The SVG markup is placed directly in the HTML body, while the accompanying `index.js` merely imports React and ReactDOM and logs the latter to the console. No interactive behavior or data-driven updates are present, as the visualization is entirely hard-coded in the markup.

Hharshulverma99@gmail.com

90% match

Loading thumbnail…

Fork of HTML Starter

This example combines React and SVG to display a simple static visualization of a yellow circle with two smaller circles positioned inside it. The page renders a basic React component that outputs the text “Hello Data” alongside the SVG shapes drawn directly in the HTML markup. React 18 handles the component rendering, while CSS resets the body margins and hides overflow. The visualization does not include any interactive or data-driven behavior, serving as a minimal starter template for integrating React with SVG graphics.

PPRINCE KUMAR

90% match

Loading thumbnail…

Fork of HTML Starter

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.

GGeorge Tanev

90% match

Loading thumbnail…

Fork of HTML Starter

This example demonstrates a minimal static composition rendered as SVG, consisting of two overlapping rectangles—a larger yellow rectangle beneath a smaller red one. The page uses plain HTML with embedded CSS and JavaScript, with no external libraries or data sources. The SVG element is sized at 500 by 500 pixels with a viewBox of 0 0 100 100, allowing the shapes to be defined in a normalized coordinate space. The code directly specifies each rectangle's position and fill color, showing a basic approach to creating vector graphics without additional tooling.

FFernando Sosa

90% match

Loading thumbnail…

Fork of HTML Starter

This example shows a static composition of basic SVG shapes, including two circles and a large rectangle, positioned directly on the page. The circles are drawn without a fill (defaulting to black) and in yellow, while the red rectangle spans the lower portion of the viewport. It uses plain SVG markup within an HTML document, with no external libraries or dynamic data. The rendering approach relies on hardcoded coordinates for each shape, demonstrating how simple geometric elements can be combined without any JavaScript interaction or framework logic.

Ssabelliadriano

90% match

Loading thumbnail…

Fork of HTML Starter

A lone yellow circle with a thick black border sits centered on a blank white canvas, rendered as an SVG element within a React application. The example demonstrates the basic structure for building visualizations with React, using ReactDOM to mount the component and JSX to define the SVG circle with fixed width and height attributes. It serves as a minimal template for starting SVG-based projects.

Vverystochastic

90% match