threejs-textures
Comprehensive texture loading, configuration, and application for Three.js scenes.
- Covers texture types including basic, data, canvas, video, and compressed formats, with loaders for each
- Supports environment mapping via cube textures, HDR (RGBE/EXR), and equirectangular conversion with PMREM
- Includes UV mapping, texture atlasing, wrapping modes, filtering, mipmaps, and render targets for dynamic effects
- Provides PBR material texture setup (color, normal, roughness, metalness, AO, emissive, displacement) with proper color space handling
- Offers memory management patterns, texture pooling, and performance optimization guidance for web delivery
Three.js Textures
Quick Start
import * as THREE from "three";
// Load texture
const loader = new THREE.TextureLoader();
const texture = loader.load("texture.jpg");
// Apply to material
const material = new THREE.MeshStandardMaterial({
map: texture,
});
Texture Loading
More from cloudai-x/threejs-skills
threejs-animation
Three.js animation - keyframe animation, skeletal animation, morph targets, animation mixing. Use when animating objects, playing GLTF animations, creating procedural motion, or blending animations.
5.3Kthreejs-fundamentals
Three.js scene setup, cameras, renderer, Object3D hierarchy, coordinate systems. Use when setting up 3D scenes, creating cameras, configuring renderers, managing object hierarchies, or working with transforms.
4.3Kthreejs-shaders
Three.js shaders - GLSL, ShaderMaterial, uniforms, custom effects. Use when creating custom visual effects, modifying vertices, writing fragment shaders, or extending built-in materials.
3.6Kthreejs-geometry
Three.js geometry creation - built-in shapes, BufferGeometry, custom geometry, instancing. Use when creating 3D shapes, working with vertices, building custom meshes, or optimizing with instanced rendering.
3.5Kthreejs-interaction
Three.js interaction - raycasting, controls, mouse/touch input, object selection. Use when handling user input, implementing click detection, adding camera controls, or creating interactive 3D experiences.
3.3Kthreejs-materials
Three.js materials - PBR, basic, phong, shader materials, material properties. Use when styling meshes, working with textures, creating custom shaders, or optimizing material performance.
3.2K