test

100%

✓ Published0🌍 Public

Last edited Apr 5, 2021

Created on Apr 5, 2021

This example presents a static composition of two SVG circles on a 960 by 500 canvas. A large yellow circle with a thick black outline is centered, while a smaller black circle is positioned to its left, creating a simple contrasting visual. The visualization is built using raw HTML, CSS, and inline SVG, with no external libraries or JavaScript logic. The SVG elements are declared directly within the HTML structure, relying on the browser's built-in vector graphics rendering.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

Similar vizzes

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

87% match

Loading thumbnail…

SVG test

This example demonstrates a minimal SVG rendering of two overlapping circles on a blank HTML page. It shows how basic vector shapes can be layered, with the first circle drawn in black and the second yellow circle placed directly on top. The page uses plain HTML and CSS, with no JavaScript or external libraries, relying solely on the browser’s native SVG support. The circles share the same center and radius, producing a solid yellow disc that completely obscures the underlying black shape, as defined in the inline markup of the index.html file.

Yyangioe

87% match

Loading thumbnail…

Welcome to HTML

This example displays a simple SVG composition featuring two overlapping circles, creating a distinct target-like visual on a blank canvas. The larger yellow circle is outlined with a thick black stroke, while a smaller unfilled circle sits at its center, both positioned at the midpoint of the 960x500 viewport. The code demonstrates fundamental HTML structure with embedded CSS for page styling and inline SVG elements, using the circle tag with attributes for positioning, radius, fill, and stroke. It serves as a minimal introduction to web-based graphics rendering.

AACS264

86% match

Loading thumbnail…

Hello HTML

This example demonstrates a simple static SVG composition, rendering a yellow circle with a black outline alongside two smaller unfilled circles, arranged to resemble a face. The HTML page contains a single SVG element with hard-coded coordinates and styling, using raw SVG circle elements rather than a charting library. The visualization relies on standard web technologies, with inline CSS in the document head to remove page margins and hide overflow. The code is a minimal, hand-authored illustration of SVG’s basic shape capabilities within an HTML document.

TThirendra Shah(CLCT)

86% match

Loading thumbnail…

hello

This example shows a simple SVG composition of three black-and-yellow circles arranged to suggest a face, rendered directly in an HTML page. It uses raw SVG markup with `<circle>` elements, specifying positions, radii, fill colors, and stroke properties. The page is styled with CSS to remove margins and hide overflow. The visualization is static, with no interaction or animation, and relies solely on inline SVG attributes rather than any JavaScript or external libraries. The data source is the hardcoded coordinates and sizes within the markup itself.

Wwalkingwang

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

86% match

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

86% match

Loading thumbnail…

Starter

This example shows a static SVG composition of three circles: a large yellow circle outlined in black, with two smaller unfilled circles positioned symmetrically on either side. The page uses HTML, CSS, and JavaScript, with the SVG canvas set to 960 by 500 pixels. The code directly defines the shapes and their properties, such as coordinates, radii, fill, and stroke, without any dynamic behavior or data loading. The rendering is plain SVG.

Ssd2beatles

85% match