Skip to main content
SimilarExport ZIP
100%

Smiley Face

✓ Published1🌍 Public
AAndres Perdomo
Last edited Nov 3, 2023
Created on Nov 3, 2023
Forked from Hello HTML

This example shows a simple smiley face rendered as a static SVG graphic. A large yellow circle forms the head, with two smaller black circles representing the eyes; the mouth is not drawn in this version. The visualization uses React 18.2.0 via a UMD script tag, though the SVG elements are written directly in the HTML markup rather than generated through React components. The code sets the SVG viewport to 960 by 500 pixels and applies basic styling for the circle fills and stroke.

AI-generated description

A bare minimum HTML page.

MIT Licensed

Similar vizzes

Loading thumbnail…

Smiley Face

This example displays a static smiley face rendered as a yellow circle with two oval eyes, each containing a black pupil, and a curved mouth implied by the SVG shapes. Constructed with React 17 and plain SVG elements, the visualization uses hard-coded circle coordinates for the face and eyes, with yellow fill, black strokes, and thick stroke widths. The SVG canvas is set to 960 by 500 pixels, and the drawing is embedded directly in HTML without any interactive behavior or data-driven updates.

Rreshali35
96% match
Loading thumbnail…

Smiley Face

A static yellow smiley face rendered as SVG, drawn with three black-filled circles for eyes and a large yellow circle for the head, outlined with a black stroke. The example uses React 16.13.1, loaded via UMD, and relies solely on SVG primitives (circle) and inline CSS. No interactions or animations are present; fixed coordinate attributes position the elements on a 960×500 canvas.

Ffolbrich001
96% match
Loading thumbnail…

Smiley face

A yellow circle with a black outline forms the face, containing two smaller black circles as eyes. The example demonstrates static SVG rendering with React, though the React library is loaded but not actively used for drawing. Instead, the visualization is created directly using SVG elements like `circle` for the face and eyes, with hardcoded coordinates and styling. The page loads React and ReactDOM via UMD bundles, but the final graphic relies purely on raw SVG markup within the HTML.

Ffutureofworld
95% match
Loading thumbnail…

Smiley Face pt 1

This example draws a simple smiley face using static SVG elements: a large yellow circle for the head and two smaller black circles for eyes. The code defines the SVG directly in the HTML markup, while React is loaded via UMD builds but not used to render any components. The face lacks a mouth, leaving the expression incomplete despite the title. The rendering uses fixed coordinates and dimensions within a 960 by 500 viewport.

Ttaujeng
95% match
Loading thumbnail…

Smiley Face

This example uses React and SVG to render a static smiley face. The face is drawn with three SVG circle elements on a 960x500 canvas: a yellow outer circle for the head and two black circles for the eyes, all with visible black strokes. The React component renders only a heading, while the SVG markup is placed directly in the HTML body, so the visualization is not generated through React itself. The code relies on the React and ReactDOM production libraries and a bundled JavaScript file, though no interactive behavior is implemented.

RRidhuparan
95% match
Loading thumbnail…

Smiley face

This example draws a simple smiley face using SVG shapes. It shows a large yellow circle for the head, two smaller unfilled circles for eyes, and relies on the stroke and fill attributes from the React-created SVG markup. The code uses React 17 via the UMD production build to render the SVG directly in the HTML, with inline properties for positioning and styling. The face is centered on a 960×500 canvas, and the mouth is implied by the head’s bottom edge rather than drawn explicitly.

Rrikaami13
95% match
Loading thumbnail…

Smiley Face Part I

A static smiley face rendered in SVG appears on a yellow circular head with black stroke, featuring two black eyes and no mouth. The visualization uses React 17.0.2 loaded via UMD script, with hardcoded circle elements placed at fixed coordinates on a 960x500 canvas. The example demonstrates basic SVG rendering through React’s createElement or JSX transformation, though no interactive behavior or data-driven updates are present.

TTegar Dimas Pradana
95% match
Loading thumbnail…

Smiley Face 1

This example renders a static smiley face using SVG shapes composed through React markup. The visualization presents a yellow circle with a black border as the face, alongside two unfilled black circles representing the eyes. The code uses React and ReactDOM to structure the SVG elements directly within the HTML page, with the `bundle.js` file loaded for the React runtime. The face is positioned based on a 960 by 500 canvas, using fixed coordinates for the facial features.

TTiagoDnts
95% match