Fork of Let's Make a Face Part I

100%

Fork of Let's Make a Face Part I

✓ Published0🌍 Public

Last edited Dec 29, 2021

Created on Dec 29, 2021

This fork of "Let's Make a Face Part I" uses raw SVG markup within an HTML page to draw a basic cartoon face. The visualization shows a large yellow circle with a black stroke for the head, plus two smaller circles for eyes at different sizes and positions. The SVG code defines explicit coordinates for each circle, with the head centered at 480,250 and a radius of 205 pixels. No JavaScript libraries or data sources are involved; the rendering relies entirely on static SVG elements and the browser's native SVG support.

AI-generated description

Half way towards a smiley face.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Let's Make a Face Part I

A simplified cartoon face rendered in SVG shows a large yellow circle head with black outline and two blank black eye circles. The code builds the illustration directly with inline SVG elements, using explicit `circle` tags for the head and eyes. The face is incomplete, as the title suggests, with no mouth drawn. The markup sets a fixed 960 by 500 pixel canvas and centralizes the head at coordinates 480,250. This example demonstrates basic SVG shape construction without JavaScript libraries or data processing, relying solely on static SVG markup for its visual output.

Ppatrup

94% match

Loading thumbnail…

Fork of Let's Make a Face Part I

This fork of "Let's Make a Face" uses raw SVG to draw three stationary circles: a large yellow face with a black outline and two smaller black-outlined eyes. The code hardcodes circle coordinates and radii (e.g., r='245' for the face, r='50' for the eyes) directly in the HTML, with no dynamic data or interaction. It renders via the SVG element in a 960x500 viewport, with CSS to hide page margins. The example demonstrates basic circle-based shape construction without using any JavaScript libraries or data-binding frameworks.

RRyan Dung Le

94% match

Loading thumbnail…

Fork of Let's Make a Face Part I

A simple SVG face shows a yellow circle head with two black eyes, rendered directly in HTML without JavaScript. The code positions a 245-pixel-radius face at the center of a 960 by 500 canvas, using inline `circle` elements with explicit `cx`, `cy`, `r`, `fill`, and `stroke` attributes. The eyes are placed at fixed offsets from the center, demonstrating static SVG drawing with the browser’s native rendering, not an interactive or data-driven visualization. No external libraries are used.

Hhommrich@web.de

93% match

Loading thumbnail…

Fork of Let's Make a Face Part I

A static SVG face made of three circles: a large yellow head with a black stroke, and two smaller black eyes positioned symmetrically. The code uses inline SVG elements within an HTML document, with circle coordinates computed relative to the center. It is a simple SVG rendering with no JavaScript or data binding, demonstrating basic geometric composition in a fixed 960 by 500 viewport.

Aanakomissaroff

93% match

Loading thumbnail…

Fork of Let's Make a Face Part I

A yellow circle with a black outline forms the base of a simple face, centered in an SVG canvas. Two smaller black circles serve as eyes, positioned symmetrically on either side of the face’s vertical midline. The code renders directly to SVG elements using static `<circle>` tags, with inline attributes for coordinates, radius, fill, and stroke. No JavaScript libraries or interaction are present; the visualization is a purely declarative HTML and SVG composition, with styling applied through a minimal embedded CSS rule that hides page margins.

PPolina Sysoeva

93% match

Loading thumbnail…

Fork of Let's Make a Face Part I

This visualization displays a simple, stylized face created with inline SVG elements. A large black circle with a yellow stroke forms the head, while two smaller yellow circles represent the eyes. The code uses raw SVG shape tags—`circle` elements for the head and eyes—rendered directly in the HTML within an SVG container sized at 960 by 500 pixels. The layout is static, with no animation or interaction, and the design is described as halfway toward a smiley face, lacking a mouth. The example is a fork of “Let's Make a Face Part I,” sourced from v3, and uses no JavaScript libraries.

RRonanJS60

93% match

Loading thumbnail…

Fork of Let's Make a Face Part I

A simple SVG face made of three circles sits centered on a yellow background. The code draws a large yellow circle with a black stroke for the head, then places two smaller black circles as eyes at fixed coordinates. This example uses raw SVG elements—`circle` tags with explicit `cx`, `cy`, `r`, and `fill` attributes—without any JavaScript libraries or data binding. The rendering is static, with all geometry hardcoded in the HTML, and the page hides scrollbars via CSS.

Ttssytrack

93% match

Loading thumbnail…

Fork of Let's Make a Face Part I

This example shows a simple cartoon face made from three SVG circles: a yellow head with a black outline and two unfilled circles for eyes. The page sets the body margin to zero and hides overflow, so the 960 by 500 pixel SVG canvas fills the viewport. The drawing is defined directly in the HTML markup using SVG element coordinates, with no JavaScript or external libraries involved. The face is centered on a 480 x 250 pointer, with the head radius set to 245 and an eye offset of 130 pixels from center.

KK M Jawadur Rahman

93% match