Untitled

100%

✓ Published0🌍 Public

Last edited Feb 24, 2021

Created on Feb 24, 2021

This example shows a simple static SVG face composed of three circles: a large yellow outer circle with a black stroke, and two smaller black circles representing eyes. The code uses React, though it only logs the React object to the console and does not yet leverage React for rendering. The SVG is drawn directly in the HTML with explicit `cx`, `cy`, and `r` attributes, using the standard SVG API for circle elements. No interactivity or data binding is present.

AI-generated description

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

Similar vizzes

Loading thumbnail…

Untitled

A static SVG face rendered with yellow circular head, black stroke, and two small circles for eyes, shown at 960 by 500 pixels. The example demonstrates a minimal React setup using React and ReactDOM from UMD builds, with the SVG markup embedded directly in the HTML page rather than generated through React. The code logs ReactDOM to the console and includes a placeholder bundle.js reference, indicating an unbuilt or starter-level project. It illustrates basic SVG shape composition without interaction or data binding.

Bbressem

92% match

Loading thumbnail…

Untitled

This example renders a simple static face using two SVG circles for eyes on a larger yellow circle, all drawn directly in the index.html file. While the page loads React 17 and ReactDOM from a CDN, the index.js file defines an empty App component and does not use React for the visualization. The SVG markup sets a 960x500 canvas with a black-stroked yellow circle centered at (480,250) and two black eye circles, demonstrating basic SVG shape rendering alongside a minimal React setup.

Ttobyviz

92% match

Loading thumbnail…

Untitled

This example renders a static yellow circle with two black circular eyes on an SVG canvas, mimicking a simple face. The visualization is built using React 17, with the outer shape and facial features defined directly as SVG circle elements. The page loads React from a CDN and logs the imported React object to the console, though no dynamic state or interactivity is implemented. The drawing is purely declarative, using fixed coordinates and radii for each shape.

EEUHaq

91% match

Loading thumbnail…

Untitled

A yellow circle rendered as an SVG face features two smaller black circles for eyes, with a thick black stroke outlining the entire shape. The visualization is built using React with JSX, directly embedding SVG elements within the `index.html` file. The `index.js` file imports React and ReactDOM to log the React object, though it does not mount any component. The static composition relies on explicit SVG circle attributes for position, sizing, and color rather than any data-driven or interactive behavior.

JJPMorand

90% match

Loading thumbnail…

Untitled

This example shows a single large yellow circle with a black outline centered on an SVG canvas, rendered at 960 by 500 pixels. The circle is drawn using a React component that directly outputs SVG markup, with its position and radius set via the `cx`, `cy`, and `r` attributes. The code relies on React and ReactDOM to mount the SVG into the page’s root element, while the circle’s fill, stroke, and stroke width are specified as SVG presentation attributes. No data source or interaction is present beyond the static shape.

NNuman Shabir

89% match

Loading thumbnail…

Document

This example shows a static SVG face composed of three circles: two small black circles for eyes and one large yellow circle with a black outline for the head. The page embeds the React libraries via CDN and logs a greeting to the browser console. It renders the shapes directly in the HTML markup using standard SVG elements like `circle`, with fixed pixel coordinates and styling controlled by inline attributes. The accompanying CSS hides page scrolling for a clean, full-viewport presentation.

Bbelegic1

89% match

Loading thumbnail…

Hello HTML

This example shows a simple static SVG face made of three circles—two small eyes and a large yellow head—rendered on a 960-by-500 canvas. The code uses React 18 via a UMD script, though the bundle is not loaded, and relies on inline SVG elements for drawing without any data or interaction. The page intentionally mixes plain HTML, CSS for margin reset and overflow hiding, and a placeholder JavaScript file that logs to the console. It demonstrates minimal SVG structure within a React setup, with no dynamic behavior or external libraries beyond React’s basic import.

Zzaaaza

89% match

Loading thumbnail…

Untitled

A yellow circle with a thick black border fills most of an SVG canvas, while a smaller unfilled circle sits in the upper-left region, creating a simple composition of overlapping geometric shapes. The example demonstrates basic SVG rendering through React, using native `circle` elements with explicit `cx`, `cy`, `r`, `fill`, and `stroke` attributes. A minimal HTML page with inline CSS and JavaScript serves as the host, showcasing how to embed static SVG directly in a React project without additional data or interaction.

SSumz-K

88% match