A HTML5 szabvány lehetőséget biztosít vektorgrafikus rajzolásra egy téglalap alakú területre. Ez a téglalap egy vászon (canvas) objektum. A vászonból pedig Three.js textúrát készíthetünk. Erre példát a ThreeJsCanvasTextTexture.html példaprogramban találunk.

var canvas1 = document.createElement('canvas');
canvas1.width = 256;
canvas1.height = 256;
var context1 = canvas1.getContext('2d');
context1.font = "Bold 40px Arial";
context1.fillStyle = "rgba(255,0,0,0.95)";
context1.fillText("Vászon textúra", 0, 50);

var texture1 = new THREE.Texture(canvas1);
texture1.needsUpdate = true;

var material1 = new THREE.MeshBasicMaterial( { map: texture1, side:THREE.DoubleSide } );
material1.transparent = true;

var meshText = new THREE.Mesh(
        new THREE.PlaneGeometry( canvas1.width, canvas1.height ),
        material1
);

meshText.position.set( -10, 80, 0 );

scene.add( meshText );