Fork of Fork of Let's Make a Face Part I

100%

Fork of Fork of Let's Make a Face Part I

✓ Published0🌍 Public

Last edited Jan 7, 2024

Created on Jan 7, 2024

Forked from Fork of Let's Make a Face Part I

This example displays a simple, static SVG composition of a smiley face, featuring a yellow circular head with a black outline and two smaller unfilled circles for eyes. The code builds the graphic directly in a raw HTML file using inline SVG elements, setting coordinates and dimensions through explicit attributes such as `cx`, `cy`, and `r`. The rendering relies on the browser's native SVG support, with a `960` by `500` viewport and styling applied via embedded CSS. No JavaScript or external libraries are used, showcasing the straightforward manual construction of vector shapes.

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 simple smiley face built from basic SVG shapes, with a yellow circular head, two smaller circles for eyes, and a nose-like center point. The code uses raw SVG elements (`circle`) with explicit attributes for `cx`, `cy`, `r`, `fill`, and `stroke` to position and style each part, rendered in an inline SVG container sized 1000 by 500 pixels. It is a static visualization with no interactive or animated behavior, demonstrating a straightforward, hardcoded geometric composition without employing any JavaScript libraries or data-driven features.

BBeihaiTianming

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

94% match

Loading thumbnail…

Fork of Let's Make a Face Part I

This example constructs a simple smiley face by layering three SVG circles on a yellow background. The code directly uses SVG markup, positioning the face’s head and two eyes with explicit `cx`, `cy`, and `r` attributes, while a black stroke outlines the head. It shows a static, minimal illustration without interactive behavior or data binding, relying on basic vector shapes to demonstrate geometric composition.

AAnna Fernandes

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

94% match

Loading thumbnail…

Fork of Let's Make a Face Part I

A static SVG face composed of three circles: a large yellow head with a black outline and two smaller black eyes positioned on a light background. The code uses inline SVG elements with explicit pixel coordinates and stroke properties to define the shapes. It renders to a 960 by 500 canvas and represents a simple, non-interactive visualization of a smiley face’s basic geometry. The example is a direct HTML/SVG implementation without any JavaScript libraries.

FFernando C. Filho

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

94% match

Loading thumbnail…

Fork of Let's Make a Face Part I

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.

Ccrocsman

94% match

Loading thumbnail…

Fork of Fork of Let's Make a Face Part I

This example shows a static smiley face built from three basic SVG shapes: two eyes and a head drawn with circles. The code uses raw SVG elements via D3 v3 syntax, though it relies on plain HTML markup rather than D3 data joins. The face is centered within an SVG canvas sized 960 by 500 pixels, with the head filled yellow and outlined in black, while the eyes remain unfilled. The rendering approach is simple declarative SVG, with positions explicitly set as pixel coordinates for each circle.

990561lkk

94% match