Skip to main content
SimilarExport ZIP
100%

Smiley Face Part 1

✓ Published1🌍 Public
AAl Wonder
Last edited Jan 2, 2022
Created on Jan 2, 2022
Forked from Hello HTML

A yellow circle with a black outline forms the face of a smiley, and two smaller black circles represent the eyes. The face is centered within a 960 by 500 pixel SVG canvas, with the head’s radius calculated to fit within the canvas height and stroke width. The composition is static and minimal, using only three SVG `<circle>` elements with explicit `cx`, `cy`, `r`, `fill`, and `stroke` attributes. The markup is authored directly in `index.html`, with no external libraries or JavaScript beyond the SVG rendering.

AI-generated description

A bare minimum HTML page.

MIT Licensed

Similar vizzes

Loading thumbnail…

Smiley Face Part 1

A yellow circle with a black outline and two smaller black circles for eyes forms a simple smiley face on an SVG canvas. The main circle is centered at 480, 250 with a radius of 245, while the eyes are placed at 350, 200 and 610, 200 with a radius of 50 each. The visualization uses raw SVG elements—`circle` tags—with fill, stroke, and stroke-width attributes to define the shapes. No JavaScript libraries are employed; the markup is directly embedded in an HTML page with no interactive or animated behavior.

FFlore
96% match
Loading thumbnail…

Smiley face Part I

A yellow circle with a black outline and two smaller black circles forms the beginning of a smiley face. The larger circle is centered on an SVG canvas, while the two eye circles are positioned symmetrically on either side of the center. The example uses raw SVG elements—`circle` with `cx`, `cy`, `r`, `fill`, and `stroke-width` attributes—directly in the HTML, with a fixed viewport of 960 by 500 pixels. No JavaScript libraries or data sources are involved; the rendering is purely static SVG markup.

PPakapone Supavarn
96% match
Loading thumbnail…

Smiley Face - Part 1

A yellow circle with a black outline forms the head of a smiley face, while two smaller solid black circles serve as the eyes. The face is centered within an SVG canvas of 960 by 500 pixels, using basic SVG circle elements with explicit coordinates and stroke attributes. No mouth is drawn, leaving the smiley face incomplete. The rendering is entirely static, with no animation or interaction, and relies solely on the SVG markup defined directly in the HTML body.

Mmadiltalay
95% match
Loading thumbnail…

Smiley Face Part I

A single yellow circle with a thick black outline and two smaller black circles inside forms a basic smiley face. The example uses raw SVG elements—specifically `<circle>` tags—within an HTML page to compose the static graphic. The code sets the main face’s radius to 245 pixels, positions the eyes at fixed coordinates, and relies on the browser’s default black fill for the pupils. No JavaScript or external libraries, such as D3, are employed; the rendering is purely declarative SVG markup. The fixed canvas size is 960 by 500 pixels, with the face centered horizontally.

GGregS1290
95% match
Loading thumbnail…

Smiley Face Part 1

A yellow circle with a black outline and two smaller black circles for eyes forms a simple smiley face. The SVG is rendered directly in an HTML page using the `circle` element, with the face centered at 960 by 500 pixels. The rendering relies on basic SVG shape attributes for positioning, fill, stroke, and stroke width, with no external data source or processing library involved. The page uses a minimal stylesheet to remove margins and hide overflow, and the code is self-contained within a single `index.html` file.

Sssarowar
95% match
Loading thumbnail…

Smiley Face Part I

A single yellow circle with a black outline forms the face, while two smaller black circles serve as eyes on a plain SVG canvas. The visualization uses native SVG elements (`circle`) with attributes for positioning, radius, fill, and stroke. The layout is computed directly from the viewport dimensions, centering the face at (480, 250) with a radius of 245, and placing each eye 50 pixels in radius at offsets from the center. This is a static, hand-coded example that does not rely on any JavaScript libraries or data binding.

Aabealam
95% match
Loading thumbnail…

Smiley Face Part 1

A yellow circle with a black outline serves as a face, containing two smaller black circles positioned as eyes on an SVG canvas. The code uses raw SVG elements (`circle`) within an HTML document, setting fixed `cx`, `cy`, and `r` attributes to render the shapes. The rendering is static, providing a half-finished smiley face without a mouth. The example demonstrates basic SVG drawing without external libraries, using a 960 by 500 pixel canvas and hardcoded coordinates for each component.

Cconorflood96
95% match
Loading thumbnail…

Smiley Face Part I

A yellow circle with a black outline and two smaller black circles for eyes forms a smiley face, rendered as a static SVG. The face is centered on a 960-by-500 canvas, with the main circle at (480, 250) and a radius of 245, while the eyes are placed at (350, 180) and (600, 180), each with a radius of 50. The code uses raw SVG elements—`circle`, `fill`, `stroke`, and `stroke-width`—without any external libraries, and the markup is embedded directly in an HTML page.

JJarrod
95% match