Fork of Hello HTML

100%

Fork of Hello HTML

✓ Published0🌍 Public

Last edited Sep 29, 2021

Created on Sep 29, 2021

A simple SVG smiley face rendered directly in HTML, showing how static shapes can be assembled without JavaScript libraries or external data. The code draws a yellow circle for the head with a black stroke, plus two smaller unfilled circles for the eyes, all positioned using fixed pixel coordinates inside an `<svg>` element that spans 960 by 500 pixels. The example demonstrates basic SVG geometry: a filled `<circle>` with `fill` and `stroke` attributes forms the face, while two additional circles use the default black fill for the eyes, omitting a mouth despite the comment hinting at one.

AI-generated description

A bare minimum HTML page.

Half way towards a smiley face.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Hello HTML

A static SVG smiley face rendered with two large circles for eyes and a yellow head, drawn entirely in HTML with no JavaScript. The code uses raw SVG elements—`<circle>` tags with explicit `cx`, `cy`, `r`, `fill`, and `stroke` attributes—to position a 960×500 canvas. It demonstrates basic geometric composition, centering the face via fixed coordinates rather than any layout or data-binding library. The example is a simple markup exercise, illustrating how SVG shapes can be combined without D3 or other visualization tools.

HHoaiLe

97% match

Loading thumbnail…

Fork of Hello HTML

This example shows a simple static smiley face drawn entirely with SVG shapes on a yellow background. The code creates three circles using raw SVG elements inside an HTML page: a large yellow circle with a black stroke for the face, and two smaller black circles for the eyes. It uses no JavaScript libraries or data sources, relying only on inline SVG attributes like `cx`, `cy`, `r`, `fill`, and `stroke-width` to define the geometry and styling, rendered directly in the browser.

MMohammad Yousuf

96% match

Loading thumbnail…

Fork of Hello HTML

This example shows a simple, static smiley face drawn with two eyes and a yellow circle on a gray background. It demonstrates the basics of embedding SVG shapes directly in an HTML document without any JavaScript or data binding. The code uses the native SVG element and its child `<circle>` tags, with attributes for position, radius, fill color, and stroke, rendered by the browser. The page is a bare-bones HTML file with no external libraries, illustrating raw SVG markup as the sole visualization technique. The black-outlined yellow circle serves as the face, while the two smaller circles act as eyes.

AAmir

96% match

Loading thumbnail…

Fork of Hello HTML

A smiley face rendered as a static SVG drawing. The example uses raw SVG elements—three `<circle>` tags—to depict a yellow head with black outline and two black eyes, all centered on a 960-by-500 canvas. The code relies on inline SVG attributes for positioning and styling, with no external libraries or JavaScript. It demonstrates the simplest possible vector graphic: shapes defined directly in markup, with the body styled to hide margins and overflow. No interactions, animations, or data-driven content appear; it serves purely as a static visual exercise.

Rrita cachaldora

96% match

Loading thumbnail…

Fork of Hello HTML

A static SVG smiley face is drawn directly in HTML using two semantic circle elements for the eyes and one larger circle for the face outline, with no JavaScript or external libraries. The face is centered on a 960×500 viewport, using a yellow fill and black stroke, with a missing mouth. The example demonstrates hand-coded SVG primitives within a bare-bones HTML page, showing how basic shapes can compose a recognizable icon.

Ppheebini

96% match

Loading thumbnail…

Fork of Hello HTML

This example shows a static smiley face drawn as a yellow circle with two black eyes, rendered entirely in SVG. The code uses plain SVG elements—a large `<circle>` with a thick black stroke and two smaller filled circles—placed inside an HTML page. No JavaScript libraries or data sources are involved; the rendering approach is direct SVG markup with inline CSS to remove page margins and hide overflow. The result is a minimal, self-contained fork of the “Hello HTML” template.

KKoleNichols

95% match

Loading thumbnail…

Fork of Hello HTML

This example shows a simple static smiley face built entirely with SVG primitives: a yellow circle with a black stroke for the head, and two smaller black circles for the eyes. The code hardcodes all shape positions and sizes directly in the SVG markup, using no external data or JavaScript libraries. Each circle is defined with explicit `cx`, `cy`, and `r` attributes within the `<svg>` element, and the page includes minimal CSS to hide overflow. It demonstrates the most basic form of SVG-based static visualization without any interaction or dynamic behavior.

EEric Weiss

95% match

Loading thumbnail…

Fork of Hello HTML

This example renders a simple SVG smiley face directly in an HTML page. A large yellow circle forms the head, with two smaller black circles as eyes, all drawn using basic SVG elements like `<circle>` and styled with fill and stroke attributes. The page’s body is set to hide overflow, and the SVG canvas is sized at 960 by 500 pixels. The code relies on no external libraries, using only native HTML and SVG markup to produce a static, self-contained graphic.

Mmtikat

95% match