Hello HTML

100%

✓ Published0🌍 Public

Last edited Apr 14, 2022

Created on Apr 14, 2022

This example displays two black-outlined circles and a smaller pair of yellow circles on a blank 960 by 500 SVG canvas. The page uses raw HTML and inline CSS to remove default body margins and hide overflow. The circles are drawn using the SVG `circle` element, with coordinates and radius defined directly in the markup. No external libraries are used; the visualization relies on native browser rendering of the SVG.

AI-generated description

A bare minimum HTML page.

MIT Licensed

Similar vizzes

Loading thumbnail…

Hello HTML

This example displays a simple static composition of three black-outlined circles on a yellow background, with a large central circle flanked by two smaller ones. The visualization is built using raw SVG elements embedded directly in an HTML page, with no external JavaScript libraries. It demonstrates basic SVG rendering by setting explicit coordinates, radii, fill colors, and stroke properties on circle elements within a fixed 960 by 500 viewport. The page uses minimal CSS to remove margins and hide overflow, focusing entirely on the vector shapes.

Ppurritola

91% match

Loading thumbnail…

Hello HTML

This example shows a single yellow circle centered on a black-outlined SVG canvas, demonstrating the minimal structure of an HTML page with embedded SVG graphics. The page uses inline CSS to remove margins and hide overflow, while the SVG element is sized at 960 by 500 pixels. The circle is drawn with a fill color, stroke, and stroke-width, all declared as SVG attributes within the markup. No JavaScript libraries or data sources are involved; the visualization relies solely on static HTML and SVG primitives.

Ffronth

90% match

Loading thumbnail…

Hello HTML

A single SVG circle with a thick black outline and yellow fill is centered, flanked by two smaller black circles, all on a blank white page. The page uses plain HTML and inline CSS to remove body margins and hide overflow. The visualization is rendered entirely through an SVG element with fixed width and height, using explicit circle coordinates and radius values rather than any JavaScript libraries or data-driven framework. It demonstrates how basic geometric shapes can be composed directly in markup.

AAnu Wat

89% match

Loading thumbnail…

Hello HTML!

This example shows two overlapping SVG circles centered on a 960×500 canvas, creating a target-like visual with a yellow outer ring and a red inner disc, each outlined in black. The circles are rendered using raw SVG elements defined directly in an HTML file, with styling applied through embedded CSS that sets the page margin to zero and hides overflow. The visualization relies solely on static SVG markup with explicit `cx`, `cy`, and `r` attributes, demonstrating fundamental vector graphics without any JavaScript or external libraries.

Bbeebeckzzz

89% match

Loading thumbnail…

Hello HTML

This example shows a single large yellow circle rendered inside an SVG element, representing a minimal HTML page. The circle is centered on a 960 by 500 canvas with a thick black stroke, and two smaller unfilled circles sit inside it as decorative elements. The page uses an inline SVG with standard SVG circle elements, styled via CSS attributes like `fill` and `stroke-width`. It demonstrates a bare-bones HTML document structure, with no external libraries or JavaScript.

GGabriel Urbani

89% match

Loading thumbnail…

Hello HTML

This example shows a simple yellow circle with a black outline and two smaller circles, rendered as static SVG. It demonstrates the most basic HTML document structure, embedding raw SVG markup directly into the page body. The code uses no external libraries, relying only on native HTML and SVG elements like `circle` and `svg`. The circles are positioned using explicit `cx`, `cy`, and `r` attributes, with colors set via `fill` and `stroke`, creating a minimal face-like graphic without any JavaScript or interaction.

Gget99carter

89% match

Loading thumbnail…

Hello HTML

This example shows a simple target-like graphic composed of two SVG circles: a large yellow circle with a thick black outline and a smaller black circle centered inside it. The visualization is rendered as raw SVG markup embedded directly in an HTML page, with no external JavaScript libraries. The code uses basic CSS within a `<style>` tag to set the page margin to zero and hide overflow, while the SVG element itself specifies a 960 by 500 pixel canvas. The circles are drawn using SVG `<circle>` elements with explicit `cx`, `cy`, `r`, `fill`, and `stroke` attributes, demonstrating the fundamental building blocks of vector graphics in a browser context.

MMartin Dobbermann

88% match

Loading thumbnail…

Hello HTML

This example shows a single yellow circle rendered on a black-bordered SVG canvas, demonstrating a minimal HTML page with embedded CSS and JavaScript. The SVG element is set to 960 by 500 pixels, with the circle centered at (480, 250) and a radius of 245. The page uses plain HTML, CSS for margin and overflow styling, and no external libraries—only native SVG tags such as `<circle>` and attributes like `fill`, `stroke`, and `stroke-width`. The rendering approach is direct SVG markup, with no data source or dynamic behavior beyond static visual output.

Aanamariacv

88% match