Whether it's possible to override the material with Scene#overrideMaterial or not.
Enables alpha hashed transparency, an alternative to Material#transparent or Material#alphaTest. The material will not be rendered if opacity is lower than a random threshold. Randomization introduces some grain or noise, but approximates alpha blending without the associated problems of sorting. Using TAA can reduce the resulting noise.
The alpha map is a grayscale texture that controls the opacity across the surface (black: fully transparent; white: fully opaque).
Only the color of the texture is used, ignoring the alpha channel if one exists. For RGB and RGBA textures, the renderer will use the green channel when sampling this texture due to the extra bit of precision provided for green in DXT-compressed and uncompressed RGB 565 formats. Luminance-only and luminance/alpha textures will also still work as expected.
alphaMap represents non-color data. Any texture assigned must have
texture.colorSpace = NoColorSpace (default).
The alpha test of node materials is by default inferred from the alphaTest
property. This node property allows to overwrite the default and define the
alpha test with a node instead.
If you don't want to overwrite the alpha test but modify the existing value instead, use materialAlphaTest.
Whether alpha to coverage should be enabled or not. Can only be used with MSAA-enabled contexts
(meaning when the renderer was created with antialias parameter set to true). Enabling this
will smooth aliasing on clip plane edges and alphaTest-clipped edges.
The red channel of this texture is used as the ambient occlusion map. Requires a second set of UVs.
aoMap represents non-color data. Any texture assigned must have
texture.colorSpace = NoColorSpace (default).
Intensity of the ambient occlusion effect. Range is [0,1], where 0
disables ambient occlusion. Where intensity is 1 and the AO map's
red channel is also 1, ambient light is fully occluded on a surface.
The lighting of node materials might be influenced by ambient occlusion.
The default AO is inferred from an ambient occlusion map assigned to aoMap
and the respective aoMapIntensity. This node property allows to overwrite
the default and define the ambient occlusion with a custom node instead.
If you don't want to overwrite the diffuse color but modify the existing values instead, use materialAO.
This node allows to modulate the influence of backdropNode to the outgoing light.
This node can be used to implement a variety of filter-like effects. The idea is
to store the current rendering into a texture e.g. via viewportSharedTexture(), use it
to create an arbitrary effect and then assign the node composition to this property.
Everything behind the object using this material will now be affected by a filter.
const material = new NodeMaterial()
material.transparent = true;
// everything behind the object will be monochromatic
material.backdropNode = saturation( viewportSharedTexture().rgb, 0 );
Backdrop computations are part of the lighting so only lit materials can use this property.
Represents the alpha value of the constant blend color.
This property has only an effect when using custom blending with ConstantAlpha or OneMinusConstantAlpha.
Represents the RGB values of the constant blend color.
This property has only an effect when using custom blending with ConstantColor or OneMinusConstantColor.
Defines the blending destination factor.
Defines the blending destination alpha factor.
Defines the blending equation.
Defines the blending equation of the alpha channel.
Defines the blending type of the material.
It must be set to CustomBlending if custom blending properties like
Material#blendSrc, Material#blendDst or Material#blendEquation
should have any effect.
Defines the blending source factor.
Defines the blending source alpha factor.
The texture to create a bump map. The black and white values map to the perceived depth in relation to the lights. Bump doesn't actually affect the geometry of the object, only the lighting. If a normal map is defined this will be ignored.
bumpMap represents non-color data. Any texture assigned must have
texture.colorSpace = NoColorSpace (default).
How much the bump map affects the material. Typical range is [0,1].
This node can be used to influence how an object using this node material casts shadows. To apply a color to shadows, you can simply do:
material.castShadowNode = vec4( 1, 0, 0, 1 );
Which can be nice to fake colored shadows of semi-transparent objects. It
is also common to use the property with Fn function so checks are performed
per fragment.
materialCustomShadow.castShadowNode = Fn( () => {
hash( vertexIndex ).greaterThan( 0.5 ).discard();
return materialColor;
} )();
Allows to overwrite the geometry position used for shadow map projection which is by default positionLocal, the vertex position in local space.
Changes the behavior of clipping planes so that only their intersection is clipped, rather than their union.
User-defined clipping planes specified as THREE.Plane objects in world
space. These planes apply to the objects this material is attached to.
Points in space whose signed distance to the plane is negative are clipped
(not rendered). This requires WebGLRenderer#localClippingEnabled to
be true.
Defines whether to clip shadows according to the clipping planes specified on this material.
Color of the material.
The diffuse color of node materials is by default inferred from the
color and map properties. This node property allows to overwrite the default
and define the diffuse color with a node instead.
material.colorNode = color( 0xff0000 ); // define red color
If you don't want to overwrite the diffuse color but modify the existing values instead, use materialColor.
material.colorNode = materialColor.mul( color( 0xff0000 ) ); // give diffuse colors a red tint
Whether to render the material's color.
This can be used in conjunction with Object3D#renderOder to create invisible objects that occlude other objects.
This node can be used as a global context management component for this material.
OptionaldefinesDefines the depth function.
Allows to overwrite depth values in the fragment shader.
Whether to have depth test enabled when rendering this material. When the depth test is disabled, the depth write will also be implicitly disabled.
Whether rendering this material has any effect on the depth buffer.
When drawing 2D overlays it can be useful to disable the depth writing in order to layer several things together without creating z-index artifacts.
The offset of the displacement map's values on the mesh's vertices. The bias is added to the scaled sample of the displacement map. Without a displacement map set, this value is not applied.
The displacement map affects the position of the mesh's vertices. Unlike other maps which only affect the light and shade of the material the displaced vertices can cast shadows, block other objects, and otherwise act as real geometry. The displacement texture is an image where the value of each pixel (white being the highest) is mapped against, and repositions, the vertices of the mesh. For best results, pair a displacement map with a matching normal map, since the renderer can not recompute surface normals from the displaced vertices.
displacementMap represents non-color data. Any texture assigned must have
texture.colorSpace = NoColorSpace (default).
How much the displacement map affects the mesh (where black is no displacement, and white is maximum displacement). Without a displacement map set, this value is not applied.
Whether to apply dithering to the color to remove the appearance of banding.
Emissive (light) color of the material, essentially a solid color unaffected by other lighting.
Intensity of the emissive light. Modulates the emissive color.
Set emissive (glow) map. The emissive map color is modulated by the emissive color and the emissive intensity. If you have an emissive map, be sure to set the emissive color to something other than black.
emissiveMap represents color data, and the texture must be assigned a
Texture#colorSpace. Most emissiveMap textures set
texture.colorSpace = SRGBColorSpace.
The emissive color of standard materials is by default inferred from the emissive,
emissiveIntensity and emissiveMap properties. This node property allows to
overwrite the default and define the emissive color with a node instead.
If you don't want to overwrite the emissive color but modify the existing value instead, use materialEmissive.
The environment map. To ensure a physically correct rendering, environment maps are internally pre-processed with PMREMGenerator.
envMap represents luminance data, and the texture must be assigned
a Texture#colorSpace. Most envMap textures set
texture.colorSpace = LinearSRGBColorSpace and use float-type formats
such as .exr or .hdr.
Scales the effect of the environment map by multiplying its color.
The rotation of the environment map in radians.
The environment of node materials can be defined by an environment
map assigned to the envMap property or by Scene.environment
if the node material is a PBR material. This node property allows to overwrite
the default behavior and define the environment with a custom node.
material.envNode = pmremTexture( renderTarget.texture );
Whether the material is rendered with flat shading or not.
Whether the material is affected by fog or not.
Whether double-sided, transparent objects should be rendered with a single pass or not.
The engine renders double-sided, transparent objects with two draw calls (back faces first,
then front faces) to mitigate transparency artifacts. There are scenarios however where this
approach produces no quality gains but still doubles draw calls e.g. when rendering flat
vegetation like grass sprites. In these cases, set the forceSinglePass flag to true to
disable the two pass rendering to avoid performance issues.
This node property can be used if you need complete freedom in implementing the fragment shader. Assigning a node will replace the built-in material logic used in the fragment stage.
This node property is intended for logic which modifies geometry data once or per animation step.
Apps usually place such logic randomly in initialization routines or in the animation loop.
geometryNode is intended as a dedicated API so there is an intended spot where geometry modifications
can be implemented.
The idea is to assign a Fn definition that holds the geometry modification logic. A typical example
would be a GPU based particle system that provides a node material for usage on app level. The particle
simulation would be implemented as compute shaders and managed inside a Fn function. This function is
eventually assigned to geometryNode.
ReadonlyisReadonlyisThis flag can be used for type testing.
ReadonlyisThis flag can be used for type testing.
The light map. Requires a second set of UVs.
lightMap represents pre-baked illuminance data, and the texture must be assigned
a Texture#colorSpace. Most lightMap textures set
texture.colorSpace = LinearSRGBColorSpace and use float-type formats
such as .exr or .hdr.
Intensity of the baked light.
Whether this material is affected by lights or not.
Node materials which set their lights property to true
are affected by all lights of the scene. Sometimes selective
lighting is wanted which means only some lights in the scene
affect a material. This can be achieved by creating an instance
of LightsNode with a list of selective
lights and assign the node to this property.
const customLightsNode = lights( [ light1, light2 ] );
material.lightsNode = customLightsNode;
The color map. May optionally include an alpha channel, typically combined
with Material#transparent or Material#alphaTest. The texture map
color is modulated by the diffuse color.
map represents color data, and the texture must be assigned a
Texture#colorSpace. Most map textures set
texture.colorSpace = SRGBColorSpace.
Discards the fragment if the mask value is false.
This node can be used to implement a shadow mask for the material.
How much the material is like a metal. Non-metallic materials such as wood
or stone use 0.0, metallic use 1.0, with nothing (usually) in between.
A value between 0.0 and 1.0 could be used for a rusty metal look.
If metalnessMap is also provided, both values are multiplied.
The blue channel of this texture is used to alter the metalness of the material.
metalnessMap represents non-color data. Any texture assigned must have
texture.colorSpace = NoColorSpace (default).
The metalness of standard materials is by default inferred from the metalness,
and metalnessMap properties. This node property allows to
overwrite the default and define the metalness with a node instead.
If you don't want to overwrite the metalness but modify the existing value instead, use materialMetalness.
MRT configuration is done on renderer or pass level. This node allows to overwrite what values are written into MRT targets on material level. This can be useful for implementing selective FX features that should only affect specific objects.
The name of the material.
The texture to create a normal map. The RGB values affect the surface
normal for each pixel fragment and change the way the color is lit. Normal
maps do not change the actual shape of the surface, only the lighting. In
case the material has a normal map authored using the left handed
convention, the y component of normalScale should be negated to compensate
for the different handedness.
normalMap represents non-color data. Any texture assigned must have
texture.colorSpace = NoColorSpace (default).
The type of normal map.
The normals of node materials are by default inferred from the normalMap/normalScale
or bumpMap/bumpScale properties. This node property allows to overwrite the default
and define the normals with a node instead.
If you don't want to overwrite the normals but modify the existing values instead, use materialNormal.
How much the normal map affects the material. Typical value range is [0,1].
Defines how transparent the material is.
A value of 0.0 indicates fully transparent, 1.0 is fully opaque.
If the Material#transparent is not set to true,
the material will remain fully opaque and this value will only affect its color.
The opacity of node materials is by default inferred from the opacity
and alphaMap properties. This node property allows to overwrite the default
and define the opacity with a node instead.
If you don't want to overwrite the opacity but modify the existing value instead, use materialOpacity.
This node can be used to overwrite the final output of the material.
Unlike NodeMaterial#fragmentNode, the built-in material logic (diffuse color, lighting, etc.) is still evaluated; assigning a node only replaces the resulting output color.
Whether to use polygon offset or not. When enabled, each fragment's depth value will be offset after it is interpolated from the depth values of the appropriate vertices. The offset is added before the depth test is performed and before the value is written into the depth buffer.
Can be useful for rendering hidden-line images, for applying decals to surfaces, and for rendering solids with highlighted edges.
Specifies a scale factor that is used to create a variable depth offset for each polygon.
Is multiplied by an implementation-specific value to create a constant depth offset.
The local vertex positions are computed based on multiple factors like the attribute data, morphing or skinning. This node property allows to overwrite the default and define local vertex positions with nodes instead.
If you don't want to overwrite the vertex positions but modify the existing values instead, use positionLocal.
material.positionNode = positionLocal.add( displace );
Override the renderer's default precision for this material.
Whether to premultiply the alpha (transparency) value.
ReadonlypropertiesThis node can be used to influence how an object using this node material receive shadows.
const totalShadows = float( 1 ).toVar();
material.receivedShadowNode = Fn( ( [ shadow ] ) => {
totalShadows.mulAssign( shadow );
//return float( 1 ); // bypass received shadows
return shadow.mix( color( 0xff0000 ), 1 ); // modify shadow color
} );
@default
Allows to overwrite the position used for shadow map rendering which is by default positionWorld, the vertex position in world space.
How rough the material appears. 0.0 means a smooth mirror reflection, 1.0
means fully diffuse. If roughnessMap is also provided,
both values are multiplied.
The green channel of this texture is used to alter the roughness of the material.
roughnessMap represents non-color data. Any texture assigned must have
texture.colorSpace = NoColorSpace (default).
The roughness of standard materials is by default inferred from the roughness,
and roughnessMap properties. This node property allows to
overwrite the default and define the roughness with a node instead.
If you don't want to overwrite the roughness but modify the existing value instead, use materialRoughness.
Defines which side of faces cast shadows. If null, the side casting shadows
is determined as follows:
FrontSide, the back side cast shadows.BackSide, the front side cast shadows.DoubleSide, both sides cast shadows.Defines which side of faces will be rendered - front, back or both.
Which stencil operation to perform when the comparison function returns false.
The stencil comparison function to use.
The bit mask to use when comparing against the stencil buffer.
The value to use when performing stencil comparisons or stencil operations.
Whether stencil operations are performed against the stencil buffer. In
order to perform writes or comparisons against the stencil buffer this
value must be true.
The bit mask to use when writing to the stencil buffer.
Which stencil operation to perform when the comparison function returns
true but the depth test fails.
Which stencil operation to perform when the comparison function returns
true and the depth test passes.
Defines whether this material is tone mapped according to the renderer's tone mapping setting.
It is ignored when rendering to a render target or using post processing or when using
WebGPURenderer. In all these cases, all materials are honored by tone mapping.
Defines whether this material is transparent. This has an effect on rendering as transparent objects need special treatment and are rendered after non-transparent objects.
When set to true, the extent to which the material is transparent is controlled by Material#opacity.
The type property is used for detecting the object type in context of serialization/deserialization.
OptionaluniformsAn object that can be used to store custom data about the Material. It should not hold references to functions as these will not be cloned.
ReadonlyuuidThe UUID of the material.
ReadonlyversionThis starts at 0 and counts how many times Material#needsUpdate is set to true.
If set to true, vertex colors should be used.
The engine supports RGB and RGBA vertex colors depending on whether a three (RGB) or four (RGBA) component color buffer attribute is used.
This node property can be used if you need complete freedom in implementing the vertex shader. Assigning a node will replace the built-in material logic used in the vertex stage.
Defines whether 3D objects using this material are visible.
Renders the geometry as a wireframe.
Defines appearance of wireframe ends.
Can only be used with SVGRenderer.
Defines appearance of wireframe joints.
Can only be used with SVGRenderer.
Controls the thickness of the wireframe.
Can only be used with SVGRenderer.
Adds a listener to an event type.
The type of event to listen to.
The function that gets called when the event is fired.
Returns a new material with copied values from this instance.
A clone of this instance.
Copies the values of the given material to this instance.
The material to copy.
A reference to this instance.
In case Material#onBeforeCompile is used, this callback can be used to identify
values of settings used in onBeforeCompile(), so three.js can reuse a cached
shader or recompile the shader for this material as needed.
This method can only be used when rendering with WebGLRenderer.
The custom program cache key.
Deserializes the material from the given JSON.
The JSON holding the serialized material.
A dictionary holding textures referenced by the material.
A reference to this material.
Checks if listener is added to an event type.
The type of event to listen to.
The function that gets called when the event is fired.
An optional callback that is executed immediately before the shader program is compiled. This function is called with the shader source code as a parameter. Useful for the modification of built-in materials.
This method can only be used when rendering with WebGLRenderer. The
recommended approach when customizing materials is to use WebGPURenderer with the new
Node Material system and TSL.
An optional callback that is executed immediately before the shader program is compiled. This function is called with the shader source code as a parameter. Useful for the modification of built-in materials.
This method can only be used when rendering with WebGLRenderer. The
recommended approach when customizing materials is to use WebGPURenderer with the new
Node Material system and TSL.
A reference to the renderer.
An optional callback that is executed immediately before the material is used to render a 3D object.
This method can only be used when rendering with WebGLRenderer.
An optional callback that is executed immediately before the material is used to render a 3D object.
This method can only be used when rendering with WebGLRenderer.
The renderer.
The scene.
The camera that is used to render the scene.
The 3D object's geometry.
The 3D object.
The geometry group data.
Removes a listener from an event type.
The type of the listener that gets removed.
The listener function that gets removed.
This method can be used to set default values from parameter objects. It is a generic implementation so it can be used with different types of materials.
Optionalvalues: MaterialParametersThe material values to set.
This method can be used to set default values from parameter objects. It is a generic implementation so it can be used with different types of materials.
Optionalvalues: MeshStandardMaterialParametersThe material values to set.
MeshStandardMaterialvariant used by mesh containers: per-proxy appearance (diffuse, opacity, metalness, roughness, emissive) is read from a MaterialPropertyTexture instead of the material's own fields.