<script src="https://threejs.org/build/three.js"></script>
body { margin: 0; }
canvas { width: 100%; height: 100% }
View Compiled
"use strict";
var scene = new THREE.Scene();
var frontSpot = new THREE.SpotLight(0xeeeece);
frontSpot.position.set(1000, 1000, 1000);
scene.add(frontSpot);
var frontSpot2 = new THREE.SpotLight(0xddddce);
frontSpot2.position.set(-300, -300, -300);
scene.add(frontSpot2);
var camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
var renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
var geometry = new THREE.TorusGeometry(10, 3, 20, 100);
var material = new THREE.MeshPhongMaterial({
    color: 0xdaa520,
    specular: 0xbcbcbc,
});
var mesh = new THREE.Mesh(geometry, material);
scene.add(mesh);
camera.position.z = 25;
function render() {
    requestAnimationFrame(render);
    mesh.rotation.y += 0.01;
    mesh.rotation.z += 0.01;
    renderer.render(scene, camera);
}
render();
View TypeScript Code

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js
  2. https://rawgithub.com/mrdoob/three.js/master/build/three.js