Skip to main content
SimilarExport ZIP
100%

Welcoom to html

✓ Published0🌍 Public
RRayanAlmadani
Last edited Mar 29, 2022
Created on Mar 22, 2022
Forked from HTML Starter

A yellow circle with a thick black outline sits on a blank SVG canvas, flanked by two smaller black-outlined circles positioned above it, resembling a face. The example demonstrates fundamental SVG rendering by directly embedding shapes like `<circle>` elements within an HTML page. It uses static SVG attributes such as `cx`, `cy`, `r`, `fill`, and `stroke-width` to define geometry and styling, with minimal CSS applied to the body for margin removal and overflow hiding. No JavaScript or external libraries are involved, relying solely on native browser rendering of SVG markup.

AI-generated description

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

See also React Starter.

MIT Licensed

Similar vizzes

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
85% 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)
85% 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
85% match
Loading thumbnail…

Hello HTML

This example displays a single yellow circle centered on a 960-by-500 SVG canvas, outlined with a thick black stroke. The circle is positioned explicitly via `cx`, `cy`, and `r` attributes inside an inline `<svg>` element. It demonstrates the minimal structure of an HTML page, using embedded CSS to remove margins and hide overflow, while the circle itself is rendered purely with static SVG markup—no JavaScript or external libraries are involved. The code serves as a bare-bones introduction to combining HTML, CSS, and SVG for basic visual output.

LLynnster5
84% match
Loading thumbnail…

Hello HTML

This example shows a single yellow circle centered on a 960 by 500 SVG canvas, with a black stroke and a radius of 245 pixels. It is a minimal demonstration of how to embed SVG directly in an HTML page using inline CSS and JavaScript-free markup. The code relies on the SVG `<circle>` element and CSS properties for sizing and stroke styling, with the body margin removed and overflow hidden for a clean, full-viewport look. It illustrates the fundamental building blocks of web-based data visualization without any external libraries.

Eeyejayvee
83% match
Loading thumbnail…

Hello HTML

A single yellow circle with a black outline is centered on a 960 by 500 SVG canvas. The example uses plain HTML, CSS, and JavaScript to demonstrate the minimal structure of a web page, with the circle drawn directly via an SVG `<circle>` element. It sets the body margin to zero and hides overflow, showcasing a basic static rendering approach without any external libraries or data sources.

Jjwadh
83% match
Loading thumbnail…

Untitled

A yellow circle with a thick black border fills most of an SVG canvas, while a smaller unfilled circle sits in the upper-left region, creating a simple composition of overlapping geometric shapes. The example demonstrates basic SVG rendering through React, using native `circle` elements with explicit `cx`, `cy`, `r`, `fill`, and `stroke` attributes. A minimal HTML page with inline CSS and JavaScript serves as the host, showcasing how to embed static SVG directly in a React project without additional data or interaction.

SSumz-K
83% match
Loading thumbnail…

Hello HTML

This example shows a simple yellow circle with two smaller black circles, forming a basic smiley face rendered in SVG. It demonstrates the minimal structure of an HTML page that combines CSS for styling and JavaScript for interactivity, though no JavaScript logic is implemented here. The visualization uses raw SVG elements—specifically `<circle>` tags—within an inline `<svg>` viewport sized 960 by 500 pixels. The CSS sets the body margin to zero and hides overflow, while the SVG itself applies attributes like `fill`, `stroke`, and `stroke-width` directly to the shapes.

Jjismis
83% match