Skip to main content
SimilarExport ZIP
100%

Smiley Face part 1

✓ Published0🌍 Public
HHuhej
Last edited Jul 4, 2021
Created on Jul 4, 2021
Forked from Hello HTML

A yellow circle with a thick black outline forms the face, alongside two smaller unfilled circles positioned as eyes, rendered directly in SVG within an HTML file. The example uses React 16.9.0, loaded via a UMD script, and relies on static SVG markup for the shapes rather than dynamic data or programmatic drawing. The page is set to hide overflow and remove default body margins, making the visualization fill the viewport.

AI-generated description

Half way toward a smiley face.

MIT Licensed

Similar vizzes

Loading thumbnail…

Smiley Face Part 1

A yellow circle with a thick black outline forms a smiley face against a white background, using two smaller black circles as eyes. The graphic is drawn entirely with SVG circle elements inside a fixed 960 by 500 viewport. This example uses React 17.0.2 to load the page, though the visual output itself relies on native SVG markup without additional data or interaction.

AAimiton Isaiah Oluwatobi
96% match
Loading thumbnail…

Smiley Face Part 1

The visualization displays a fixed yellow circle with a black outline and two smaller black circles positioned as eyes, forming a static smiley face. It renders directly through inline SVG markup within an HTML page, using absolute coordinates for each shape. The code loads React and ReactDOM via UMD scripts from unpkg, while the visible face itself is plain SVG without any programmatic interaction or dynamic behavior.

Yyodadroid
95% match
Loading thumbnail…

Smiley Face Part 1

A yellow circle with a black outline represents a smiley face, containing two smaller black circles as eyes. The example demonstrates basic SVG rendering within a React application, using hardcoded SVG circle elements positioned via `cx` and `cy` attributes. The page loads React from a UMD build and logs "Hello JavaScript" to the console. The visualization is static, with no interactivity or animation, serving as a simple introduction to combining React with SVG markup.

995shavinda
95% match
Loading thumbnail…

Smiley face part 1

A yellow circle with a black outline and two black eye circles forms a smiley face, centered on an SVG canvas. The face is drawn using React with JSX, rendering SVG elements such as `<circle>` for the head and eyes. The code positions each circle using computed coordinates and fixed constants for offsets, radii, and stroke width. The example uses React 17 and ReactDOM to mount the SVG into the page, demonstrating basic component-based visualization without interactive behavior.

Eelizww
95% match
Loading thumbnail…

Smiley Face Part I

This visualization displays a yellow circle with a black outline and two unfilled circular eyes, forming the initial components of a smiley face. The SVG markup defines the shapes directly, positioning the central face at 480,250 with a radius of 245, and placing the eye circles at offset x-coordinates. The example uses React 16.9.0 loaded via UMD, with the React library logged to the console and bundled through a separate JavaScript file.

NnimbusFarzaneh
95% match
Loading thumbnail…

Smiley Face Part 1

This example shows a yellow circle with a black outline serving as a face, alongside two smaller black-outlined circles as eyes, all rendered on a fixed 960 by 500 SVG canvas. The page uses plain HTML and CSS to set up the layout, while React 16.7.0 is loaded via a CDN script tag, though no React components are actually instantiated. Instead, the visualization relies entirely on static SVG elements (circle tags) with hardcoded coordinates and styling to create the partial smiley face.

DDavid Allyn
95% match
Loading thumbnail…

Smiley Face Part 1

A yellow circle with a black outline forms the base of a smiley face, with two smaller black circles positioned as eyes. The face is drawn using React components that render SVG shapes, with dimensions and positions calculated from center coordinates and offset constants. React 16.9.0 and ReactDOM 17.0.2 are loaded via UNPKG, and the interactive-less, static visualization is generated through declarative JSX code. The current version shows only the head and eyes, omitting the mouth as indicated by the title and file comments.

Oosaidhashmi31
95% match
Loading thumbnail…

Smiley Face Part I

A yellow circle with a black outline and two smaller black circles as eyes forms a partial smiley face on an SVG canvas. The example uses React 17 to render static SVG elements via JSX syntax, with the `circle` component defining the face and eye positions. The SVG is 960 by 500 pixels, and the code is embedded directly in the HTML document. No interaction or animation is present; it solely displays the initial geometric shapes.

CChongho Lee
95% match