Skip to main content
SimilarExport ZIP
100%

Fork of HTML Starter

✓ Published0🌍 Public
BBin
Last edited Mar 17, 2021
Created on Mar 17, 2021
Forked from HTML Starter

This example renders a single yellow circle with a black stroke on an SVG canvas, centered against a plain white background. It uses inline CSS to control page layout and SVG elements directly in the HTML to define the circle’s position, radius, and colors. The page serves as a minimal demonstration of combining HTML, CSS, and JavaScript for basic graphics. No external libraries or data sources are used; the visualization is purely static.

AI-generated description

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

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of HTML Starter

This example renders a simple yellow circle with a black outline and a smaller unfilled circle on a blank SVG canvas. The HTML page uses a minimal CSS reset to remove body margins and hide overflow. The SVG elements are drawn directly in the markup with explicit coordinates and dimensions, demonstrating basic static vector graphics without any JavaScript libraries or data binding.

RRedcoat314
96% match
Loading thumbnail…

Fork of HTML Starter

This example shows a single yellow circle with an orange stroke centered on an SVG canvas. The code uses plain SVG elements—specifically a `<circle>` with explicit `cx`, `cy`, `r`, `fill`, and `stroke` attributes—rendered at a fixed 960 by 500 pixel size. It also includes inline CSS that removes page margins and hides overflow, plus a JavaScript `console.log` statement for debugging in the developer tools. The visualization demonstrates a minimal HTML page combining SVG drawing with basic styling and scripting, without relying on any external libraries or data sources.

Ssethduckens
95% match
Loading thumbnail…

Fork of HTML Starter

This example shows a single yellow circle centered on a 960x500 SVG canvas, with a black outline and a stroke width of 10 pixels. The circle is positioned at coordinates (480, 250) with a radius of 200, demonstrating basic SVG shape rendering within an HTML page. The visualization uses plain SVG elements and CSS styling, with the `index.html` file containing the markup directly. The `README.md` references the React Starter as a related example, but this version uses no JavaScript libraries or frameworks, relying solely on static SVG markup.

AAleex94
95% match
Loading thumbnail…

Fork of HTML Starter

This example displays a single yellow circle with a black stroke centered on a 960 by 500 SVG canvas. It uses native SVG elements within an HTML page, with inline CSS to remove page margins and hide overflow. The circle’s position and radius are set explicitly, though the code includes a typo in the `stroke` attribute. It demonstrates a minimal setup for rendering vector graphics in the browser.

JJorge A. Lima
95% match
Loading thumbnail…

Fork of HTML Starter

This example displays a single yellow circle with a black outline at the center of an SVG canvas. The page uses raw HTML, CSS, and JavaScript, with the circle defined directly in the SVG markup. The CSS sets the body margin to zero and hides overflow, while the SVG specifies a width of 960 pixels and height of 500 pixels. No external libraries are used; it is a bare-bones starter template for creating SVG-based visualizations.

MMatt
95% match
Loading thumbnail…

Fork of HTML Starter

This example renders a single yellow circle centered on an SVG canvas. The circle uses a fixed radius, a black stroke, and a yellow fill, with the canvas dimensions hardcoded at 960 by 500 pixels. The visualization is built with React and ReactDOM, using JSX to declare the SVG `<circle>` element, while the page itself loads React from a CDN in the HTML file.

YYuqi Tang
94% match
Loading thumbnail…

Fork of HTML Starter

This example displays a simple yellow circle with a black outline centered on an SVG canvas, flanked by two smaller black circles representing a stylized face. The page is a bare-bones HTML document that loads React 16.7.0 from a CDN but does not use any React components or methods. Instead, it relies on plain SVG elements—circle, cx, cy, r, fill, and stroke—to render the shapes, while CSS classes control font styling for an empty message area. The rendering approach is direct, static SVG without data binding or interaction.

JJake
94% match
Loading thumbnail…

Fork of HTML Starter

This example presents a simple SVG scene of a yellow circle with a thick black stroke, accompanied by two smaller unfilled circles positioned on either side. The visualization is built with raw HTML, CSS, and JavaScript, rendering directly to SVG elements within an HTML page. The CSS sets the body margins to zero and hides overflow, while the SVG canvas is sized at 960 by 500 pixels. No external libraries or data sources are used, making this a minimal demonstration of static vector graphics.

Rresponsibilities5
94% match