Skip to main content
SimilarExport ZIP
100%

Fork of Let's Make a Face Part I

✓ Published0🌍 Public
Aaashrithd4
Last edited Feb 18, 2022
Created on Feb 18, 2022

Three static SVG shapes form a simple smiley face: a yellow circle with a thick black stroke for the head and two smaller black circles for eyes. The head is centered at 480, 250 with a radius of 245, while the eyes are placed symmetrically at 350 and 600 on the x-axis. The example uses raw SVG elements—`circle` and attributes like `cx`, `cy`, `r`, `fill`, and `stroke-width`—without any JavaScript libraries or data binding. The face remains incomplete, showing only the head and eyes, with no mouth or other features rendered.

AI-generated description

Half way towards a smiley face.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Let's Make a Face Part I

This example shows a static smiley face built from three SVG circles: a large yellow head with a black outline and two smaller black eyes. The head is centered at (480, 250) with a radius of 245, while the eyes are positioned at (350, 180) and (600, 180) with a radius of 50. The code uses raw SVG elements—`circle` tags with attributes for position, fill, stroke, and stroke-width—rather than a library like D3. The page is styled with minimal CSS to remove margins and hide overflow, and the face represents “halfway” progress toward a more complex face.

RRoshan Kumar
96% match
Loading thumbnail…

Fork of Let's Make a Face Part I

This example shows a static smiley face built from three SVG circles: a large yellow head with a black outline and two smaller black eyes. The head is centered at (480, 250) with a radius of 245, while the eyes are positioned at (350, 180) and (600, 180) with a radius of 50. The code uses raw SVG elements—`circle` tags with attributes for position, fill, stroke, and stroke-width—rather than a library like D3. The page is styled with minimal CSS to remove margins and hide overflow, and the face represents “halfway” progress toward a more complex face.

RRoshan Kumar
96% match
Loading thumbnail…

Fork of Let's Make a Face Part I

A static SVG smiley face drawn with three circles: a yellow outer head with a black stroke, and two smaller black eyes positioned symmetrically around the center. The page uses raw SVG elements inside an HTML document, with explicit pixel coordinates for the circles’ centers and radii. The head is centered at (480, 250) on a 960×500 canvas, while the eyes sit at (350, 180) and (600, 180), leaving room for a future mouth. No JavaScript or D3 APIs are used; this is a plain markup example.

Ppalak124
96% match
Loading thumbnail…

Fork of Let's Make a Face Part I

This example shows a simple, static smiley face constructed from three SVG circles: a large yellow head with a black stroke, and two smaller black eyes positioned symmetrically on either side. The rendering relies on raw SVG elements inside an HTML document, using circle attributes for coordinates, radius, and styling. No JavaScript libraries or data sources are involved; the code directly defines the geometry and appearance. It serves as a basic demonstration of SVG shape composition.

KKing
95% match
Loading thumbnail…

Fork of Let's Make a Face Part I

This example creates a basic smiley face using SVG shapes coded directly in an HTML file. It shows a large yellow circle with a black border as the head, alongside two smaller black circles for eyes. The code uses no JavaScript libraries, instead relying on raw SVG elements like `<circle>` with inline attributes for positioning and styling. The rendering approach is static SVG, with the face centered at 480,250 and eyes offset horizontally on either side.

RRShailza
95% match
Loading thumbnail…

Fork of Let's Make a Face Part I

This example shows a simple, static smiley face constructed from three SVG circles: a large yellow head with a black outline, and two smaller black eyes positioned symmetrically on either side of the center. The face is hardcoded in an HTML file using raw SVG elements with explicit coordinates and attributes, setting the head radius to 245 and the eye radii to 50. No JavaScript libraries or data sources are involved; the rendering relies entirely on the browser’s built-in SVG support provided by the `svg` element and its `circle` children. The page’s CSS hides margins and overflow to display the face cleanly.

IIRSPI
95% match
Loading thumbnail…

Fork of Let's Make a Face Part I

This example shows a simple, static smiley face constructed from three SVG circles on a yellow face, with two black eye circles positioned on either side of the center. The face is drawn using raw SVG elements—a yellow `<circle>` with a black stroke, and two unfilled `<circle>` elements for the eyes—all laid out on a 960-by-500 canvas. No JavaScript libraries or animation logic are present; the effect relies entirely on the SVG markup and CSS resets to remove page margins. The rendering is purely vector-based, with coordinates hard-coded into the HTML file.

SSebastian Ruggero
95% match
Loading thumbnail…

Fork of Let's Make a Face Part I

This example shows a simple smiley face built from three SVG circles: a large yellow circle for the head and two smaller black circles for the eyes. The face lacks a mouth, as noted in the README, so it is halfway to completion. The code uses raw SVG elements with fixed coordinates, including circle positioning and stroke styling, rendered at 960 by 500 pixels. No JavaScript libraries or data sources are involved beyond the static SVG markup.

Aaniosindustries
95% match