<script src="https://threejs.org/build/three.js"></script>
body { margin: 0; }
canvas { width: 100%; height: 100% }
View Compiled
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 Compiled
Run Pen

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