tsl-textures

TSL Textures

Clouds

This texture renders clouds. The texture has alpha channel to support transparency and opacity. Click on a snapshot to open it online.

Code example

import { clouds } from "tsl-textures";

model.material.colorNode = clouds ( {
	scale: 2,
	density: 0.5,
	opacity: 1,
	color: new THREE.Color(16777215),
	subcolor: new THREE.Color(10526896),
	seed: 0
} );

model.material.transparent = true;
model.material.opacity = 1;
model.material.side = THREE.DoubleSide;
model.material.opacityNode = clouds.opacity ( {
	scale: 2,
	density: 0.5,
	opacity: 1,
	color: new THREE.Color(16777215),
	subcolor: new THREE.Color(10526896),
	seed: 0
} );

Parameters

• scale – level of details of the pattern, higher value generates finer details, [0, 4]
• variety – hue variety of the color, [0,1]
• color – color of circles
• subcolor – secondary color for thin clouds
• seed – number for the random generator, each value generates specific pattern

Online generator

online/clouds.html

Source

src/clouds.js

Home

This site is open source. Improve this page.