Fork of Let's Make a Face Part I

100%

Fork of Let's Make a Face Part I

✓ Published0🌍 Public

Last edited Aug 29, 2021

Created on Aug 29, 2021

This example shows a simple, static smiley face built as a standalone SVG graphic. A large yellow circle serves as the head, outlined with a thick black stroke, while two smaller unfilled circles represent the eyes. The page uses raw SVG elements—`<svg>`, `<circle>`, and inline attributes like `cx`, `cy`, `r`, and `stroke-width`—placed directly in the HTML without any JavaScript libraries. The layout is centered via hardcoded coordinates, and the `README.md` notes the face is only half-complete, indicating a step toward a fuller drawing.

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 partially completed smiley face drawn with SVG primitives. A large yellow circle with a black stroke forms the head, while two smaller unfilled circles represent the eyes. The code uses raw SVG elements—`<circle>` tags with explicit `cx`, `cy`, `r`, `fill`, and `stroke` attributes—inside an inline `<svg>` block. No JavaScript libraries are employed; the rendering is purely declarative SVG markup, positioned within a 960×500 viewport.

Jjam9501

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

96% match

Loading thumbnail…

Fork of Let's Make a Face Part I

A static SVG face renders a yellow circle with black stroke as the head, plus two smaller solid-dark circles for eyes. The code manually positions these shapes using hard-coded `cx`, `cy`, `r`, `fill`, and `stroke` attributes within an inline `<svg>` element sized 960 by 500. It provides a basic, unfinished smiley-face composition, with the mouth omitted, as noted in the README. This example uses no JavaScript libraries or data sources.

KKamila

95% match

Loading thumbnail…

Fork of Let's Make a Face Part I

This example shows a static smiley face constructed with three SVG circles: a large yellow head with a black outline, and two smaller unfilled eyes. The code uses plain SVG elements inside an HTML page, with coordinates and stroke widths positioned explicitly via the `cx`, `cy`, `r`, and `stroke-width` attributes. No JavaScript libraries or D3 APIs are required; the rendering depends entirely on the browser’s native SVG support. The data is hard-coded in the markup, and the visual output is a simple, geometric face that stops halfway toward a smile.

MMaria

95% match

Loading thumbnail…

Fork of Let's Make a Face Part I copy

A static SVG drawing of a smiley face, built directly in the HTML markup without any JavaScript libraries. The image shows a large yellow circle for the head, outlined in black, with two smaller black circles representing the eyes positioned on the upper half. The `index.html` file uses raw SVG elements—`<circle>` tags with explicit `cx`, `cy`, and `r` attributes—to compose the face on a 960×500 canvas. No data source or interactive behavior is present; the rendering relies solely on hand-coded SVG coordinates.

Ddreidrachen

95% match

Loading thumbnail…

Fork of Let's Make a Face Part I

This example shows a simple yellow smiley face, constructed from three SVG circles: a large yellow face with a black outline and two smaller black circles for eyes. The face is centered on a 960 by 500 canvas, with the head positioned at the midpoint and the eyes offset horizontally. Rendered directly via inline SVG elements in the index.html file, the code uses no external libraries, relying on basic shape attributes like `cx`, `cy`, `r`, and `stroke-width` to define the visual. The accompanying README notes it is only "half way towards a smiley face," as the mouth is absent.

Llizard1111

95% match

Loading thumbnail…

Fork of Let's Make a Face Part I

This example draws a simple smiley face using SVG primitives inside an HTML page. It shows a large yellow circle with a thick black stroke as the face, alongside two smaller black circles positioned for the eyes. The code directly constructs the `<circle>` elements within a 960-by-500 SVG canvas, using explicit `cx`, `cy`, and `r` attributes to place each shape. No JavaScript libraries are used; the rendering relies solely on static SVG markup.

MMatthewNunes

95% match

Loading thumbnail…

Fork of Let's Make a Face Part I

This example creates a simple smiley face using raw SVG shapes. It shows a yellow circle for the head, two smaller black circles for eyes, and a stroke to outline the face. The code renders directly to an SVG element with hard-coded coordinates, using no external libraries or data sources. The face is static, with the author noting it is only half way towards a complete smile, as the mouth is not yet drawn. The rendering approach is straightforward SVG markup within an HTML document.

Eemelrix

95% match