Skip to main content
SimilarExport ZIP
100%

Fork of HTML Starter

✓ Published0🌍 Public
RRomersims
Last edited Feb 11, 2022
Created on Feb 11, 2022
Forked from HTML Starter

This example demonstrates a minimal Three.js scene featuring a rotating green cube rendered with WebGL. The code sets up a perspective camera, a box geometry with basic mesh material, and an animation loop that updates the cube’s rotation each frame. It uses Three.js’s `Scene`, `PerspectiveCamera`, `WebGLRenderer`, and `requestAnimationFrame` to create the 3D visualization. The page also includes a static HTML message styled with CSS, while the JavaScript for the cube is embedded directly in the document.

AI-generated description

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

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

My first three.js app

A green cube rotates continuously in a three-dimensional scene rendered using Three.js. The example demonstrates basic 3D visualization setup with a scene, perspective camera, and WebGL renderer. It creates a cube mesh from a BoxGeometry with a MeshBasicMaterial, positions the camera, and uses a requestAnimationFrame loop to incrementally update the cube’s rotation on the x and y axes. The code constructs the entire visualization directly in JavaScript within an HTML page, sourcing the Three.js library from the official threejs.org build.

Hhenrik.voigt@uni-jena.de
79% match
Loading thumbnail…

My first Three.js app

A green cube spins slowly, rendered against a black background. The example demonstrates a minimal Three.js scene. It uses a `PerspectiveCamera` and a `WebGLRenderer` to draw a box geometry with a `MeshBasicMaterial`. The cube’s rotation is updated in a `requestAnimationFrame` loop, with horizontal and vertical velocities that accumulate random jitter, producing a slightly wobbly, organic motion. A second version shows the cube as a white wireframe.

11wheel
78% match
Loading thumbnail…

Fork of HTML Starter

This example shows a simple static SVG scene with a large aquamarine circle bordered in pink, flanked by two smaller unfilled circles. The code renders the shapes using raw SVG elements in an HTML page, with CSS controlling page layout and body styling. JavaScript logs a message to the browser console, demonstrating basic interaction with the developer tools. The visualization relies on no external libraries, using only vanilla HTML, CSS, and JavaScript to create a minimal geometric composition.

Mmarkengland20
77% match
Loading thumbnail…

Fork of HTML Starter

This example demonstrates a static web page that combines styled HTML text with inline SVG shapes. A red circle and a blue outlined rectangle are drawn directly within the SVG markup, while a styled header and paragraph provide context. The code utilizes core HTML, CSS, and JavaScript, with CSS transitions applied to the circle’s font-size property, though no animation is triggered without additional scripting. The page is a minimal starter template for experimenting with D3.js and web visualization, rendering entirely through the browser’s native SVG and CSS capabilities.

RRomersims
76% match
Loading thumbnail…

Fork of HTML Starter

This example is a minimal HTML page that uses CSS and JavaScript to display a static visualization. It demonstrates the foundational structure for a web-based graphic, rendering a simple visual element on a canvas. The code provides a barebones template for customizing a visualization, serving as a starting point for more complex projects. It is a fork of an HTML starter, showcasing the core technologies of the web.

AAsrar Al Qassem
76% match
Loading thumbnail…

Fork of HTML Starter

This example displays a static SVG scene with a green circle and a red rectangle outlined in blue, set above a large “Hello HTML!” message. It demonstrates the foundational use of raw HTML, CSS, and JavaScript within a single document. The SVG elements are drawn using the standard `circle` and `rect` tags, while the message’s appearance is controlled through a CSS class rule. The code does not rely on external libraries; instead, it serves as a minimal starter template where the browser’s native rendering of SVG and CSS provides the entire visual output.

Ssantoshmitra-05
76% match
Loading thumbnail…

Fork of HTML Starter

This example renders a minimal HTML page with embedded CSS and JavaScript, demonstrating the fundamental structure of a web-based visualization. The code defines an empty HTML document with a style block and a script tag, providing a blank canvas for adding custom visualizations. It uses plain DOM elements and JavaScript without any external libraries or frameworks, highlighting the bare essentials needed to build a data visualization. The page includes a connection to a React Starter example, though it currently contains no rendering logic or data processing.

Kkhannoorb
76% match
Loading thumbnail…

Fork of HTML Starter

This example displays a simple SVG scene with a large green circle and two smaller unfilled circles positioned symmetrically inside it. The rendering uses raw SVG elements defined directly in the HTML file, with CSS styling for the body and a font-size rule that is not applied to any visible text. JavaScript is not used; the visualization relies solely on static markup and inline SVG attributes for positioning and appearance.

AAdam Idone
76% match