Side-eye Smiley Part I

100%

Side-eye Smiley Part I

✓ Published1🌍 Public

Last edited Feb 15, 2021

Created on Feb 14, 2021

A yellow circle with a black outline contains two smaller circles, creating a simple smiley face whose eyes are shifted to one side. The composition uses the SVG `<circle>` element directly, with coordinates and radii set as attributes inside a static `index.html`. The rendering is fixed at 960 by 500 pixels, with the main face centered and the eyes placed asymmetrically to produce the "side-eye" effect. The example demonstrates basic vector shape drawing without external JavaScript libraries.

AI-generated description

Almost there toward a funny smiley face.

MIT Licensed

Similar vizzes

Loading thumbnail…

Side-eye Smiley Part II

A smiley face rendered in yellow with black outlines looks askance through two offset eyes and a curved mouth. Built with React components and D3's `arc` generator, the SVG circles and path define the face’s features. The code uses static, hard-coded values for dimensions and positions, with D3 v6 handling the mouth’s arc calculation. The visualization is a playful, minimalist exercise in combining React’s declarative structure with D3 geometry.

88DancingElephants

88% match

Loading thumbnail…

Smiley Face Part I

A yellow circle with a black outline forms the base of a smiley face, accompanied by two solid black circles intended as eyes. The second eye has an empty `cx` attribute, leaving it visually omitted, so only one eye renders. The static SVG uses hardcoded coordinates and radii, with no JavaScript libraries or data sources, and is presented on a 960 by 500 canvas with a hidden page margin.

Bblueyjuice

88% match

Loading thumbnail…

Smiley Face Part I

A static SVG smiley face shows a yellow circle with two smaller eye circles, but no mouth yet, as the first part of a two-step progression. The code uses the SVG `<circle>` element, with the main face positioned at the center of a 960×500 viewport, filled yellow with a black stroke. The two eyes are placed symmetrically, using fixed coordinates. The rendering is purely geometric and does not involve any JavaScript libraries or data sources; it is a simple hand-authored vector graphic.

Jjeremyleehill

88% match

Loading thumbnail…

Smiley Face Part I

A yellow circular face with a black outline and two dark eyes is centered on an empty SVG canvas. The eyes are positioned asymmetrically, with the left eye offset from the vertical center. The example uses raw SVG elements—specifically three `circle` tags—with explicit `cx`, `cy`, and `r` attributes to define the shapes. The rendering is static, with no animation or interactivity. The page is contained in a single HTML file with minimal CSS to hide scrollbars, and the SVG viewport is set to 960 by 500 pixels.

JJane

87% match

Loading thumbnail…

Smiley Face Part I

A yellow circle with a black outline and two smaller black circles inside forms a basic smiley face. The example demonstrates static SVG rendering using inline `<circle>` elements within an `<svg>` canvas. The face is centered on a 960 by 500 pixel viewport, with the main circle's radius and stroke width set directly in the markup. The code does not use any JavaScript libraries or data binding, relying entirely on hardcoded SVG attributes for positioning and styling. The two eye circles are placed at fixed coordinates, while the mouth is absent, leaving the face incomplete.

Aajie

87% match

Loading thumbnail…

Smiley Face Part I

A single large yellow circle with a black outline forms the head of a smiley face, accompanied by two smaller black circles positioned as eyes. The SVG is rendered directly in the browser using inline `<circle>` elements, with attributes for coordinates, radius, fill, and stroke set manually. The example uses no JavaScript libraries, only static SVG markup. The eyes are placed symmetrically around the center, and the design leaves the mouth unfinished, as indicated by the title.

PPichit-V

87% match

Loading thumbnail…

Smiley Face - Part I

This example shows a yellow circle with a thick black outline, creating a simple, static smiley-face base. Two smaller black circles serve as eyes, positioned symmetrically on either side of the face’s vertical center. The graphic is drawn directly in SVG using basic `<circle>` elements, with coordinates hard-coded into the markup. The code does not include a mouth, leaving the face incomplete, as the title suggests. The visualization uses no external JavaScript libraries, relying solely on native SVG rendering.

Aamandaweisbrod18@gmail.com

87% 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

87% match