Skip to main content
SimilarExport ZIP
100%

Make a face

✓ Published0🌍 Public
Sshaji K
Last edited May 6, 2021
Created on May 6, 2021
Forked from Hello HTML

A yellow circle with a black outline fills the center of a blank SVG canvas, creating a minimalist base for a face. The example uses a single static `<circle>` element rendered via SVG, with hard-coded coordinates and styling defined directly in the HTML. It relies on no external libraries or data sources, serving as a simple demonstration of basic SVG shape drawing and CSS styling within an HTML page. The fixed width and height constrain the graphic to a 960×500 viewport.

AI-generated description

A bare minimum HTML page.

MIT Licensed

Similar vizzes

Loading thumbnail…

making a face

A simple static face built with SVG primitives in an HTML page. The graphic shows a yellow circle as the head with black outlines, and two smaller filled circles as eyes, arranged symmetrically on a 960-by-500 canvas. Using inline `<circle>` elements, the code sets explicit coordinates and radii for each shape, with no interactivity or animation. The example demonstrates basic SVG markup and styling directly in HTML, with margins removed via CSS for a clean, full-viewport presentation.

Llassori3@gatech.edu
92% match
Loading thumbnail…

Making a face

This example shows a simple yellow face constructed from three SVG circles on a 960-by-500 canvas. The face’s head is drawn with a large yellow circle outlined in black, while two smaller black circles serve as eyes, positioned symmetrically around the center. The code uses plain SVG elements (circle) with attributes for radius, center coordinates, fill, and stroke, rendered directly in HTML without any JavaScript libraries or data sources. The visual result is a minimal, static illustration that demonstrates basic SVG shape composition and positioning.

SSahhimanshu7
91% match
Loading thumbnail…

Let's Make a Face

This example shows a simple face constructed from three SVG circles against a yellow background. The face comprises two small black circles for eyes and a larger yellow circle for the head, with a black outline defining its boundary. The visualization is created using a static SVG canvas with fixed coordinates and styling properties like fill color and stroke width, all implemented directly in the HTML markup. The code relies solely on the native SVG API within the browser, without any external libraries or interactive behavior.

Ttshardey
90% match
Loading thumbnail…

Making a Face

A simple SVG face built with basic shapes offers a playful introduction to static data visualization. The yellow head is a large circle with a black outline, while two smaller unfilled circles serve as eyes, all rendered directly in the HTML markup without any JavaScript libraries. This example demonstrates fundamental SVG drawing through declarative elements like `circle` and `stroke` attributes, showing how raw geometric primitives can compose a recognizable figure. The code uses plain SVG within an embedded `svg` tag, with no external dependencies.

MMateusGaldinoLG
90% match
Loading thumbnail…

Data | Make a Face with HTML, CSS, SVG

A simple SVG face is drawn with three circles: a yellow head with a black stroke and two black eyes. The example demonstrates basic SVG shape rendering within an HTML page, using a fixed 960 by 500 canvas and hardcoded coordinates. No JavaScript or external libraries are used; only the SVG `circle` element and inline CSS control the layout and hide page overflow. The face is static, with no interaction or animation, serving purely as a minimal illustration of vector graphics markup.

AAndreRGunawan
90% match
Loading thumbnail…

Make a face-1

A yellow circle with a black outline forms the face, containing two smaller black-outlined circles for eyes. The SVG is rendered at 960 by 500 pixels, with all shapes positioned absolutely via `cx` and `cy` attributes. The page uses raw SVG elements—`<circle>` for both the face and eyes—inside an HTML body with minimal styling. No JavaScript libraries are used; the visualization relies entirely on static SVG markup.

AArshilAK
89% match
Loading thumbnail…

Lets Make a Face Learn

This example shows a static SVG face composed of a yellow circle with a black stroke for the head, two unfilled circles for eyes, and an implied smile that remains unfinished. The rendering uses basic SVG elements—`<svg>`, `<circle>`, and inline styling—within an HTML document. Data is hardcoded in the markup, positioning the head at center (480, 250) with a radius of 245, and eyes offset to the left and right. The page sets body margins to zero and hides overflow, focusing attention on the face. No dynamic libraries or interactive behavior are present.

Vvochi2025
89% match
Loading thumbnail…

Make a Face Part I

A static SVG face built from three circles: a large yellow head with a black outline and two smaller unfilled circles for eyes. The code defines the SVG canvas directly in HTML, positioning the head at the center of a 960 by 500 viewport and placing the eyes symmetrically on either side. The rendering relies on raw SVG circle elements with explicit coordinates and stroke properties. The example demonstrates basic geometric composition and styling within an inline HTML document.

PPatrick Hebner
88% match