...

/

Materials in Three.js

Materials in Three.js

Learn about different types of materials used in Three.js.

Overview

While working with light sources, we talked a bit about materials. We  learned that a material, together with a THREE.Geometry instance, forms a THREE.Mesh object. A material is like the skin of an object that defines what the outside of a geometry looks like. For example, a skin defines whether a geometry is metallic-looking, transparent, or shown as a wireframe. The resulting THREE.Mesh object can then be added to the scene to be rendered by Three.js.

Types of materials

So far, we haven’t looked at materials in much detail. We’ll dive into all the materials Three.js has to offer and we’ll learn how we can use these materials to create good-looking 3D objects. The materials we’ll explore are shown in the following list:

  • MeshBasicMaterial: This is a basic material that we can use to give our geometries a simple color or show the wireframe of our geometries. This ...