threejs-textures

Manage Three.js texture loading, colour space configuration, and memory optimization.

Updated May 18, 2026
One-click install
npx skills add https://github.com/afovea/game-dev-skills --skill threejs-textures-afovea
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: threejs-textures
Source: https://github.com/afovea/game-dev-skills/tree/main/plugins/game-tech/skills/threejs-textures
Command: npx skills add https://github.com/afovea/game-dev-skills --skill threejs-textures-afovea

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill resolves common rendering issues like incorrect colour spaces, inefficient VRAM usage, and complex UV mapping configurations in Three.js projects.

Core Features & Use Cases

  • Texture Management: Handles loading, colour space tagging (sRGB vs Linear), and memory disposal to prevent leaks.
  • Advanced Rendering: Provides implementation patterns for PBR texture sets, KTX2 compression, and procedural DataTextures.
  • Use Case: When a 3D model appears washed out or causes performance drops, use this skill to correctly configure texture colour spaces and implement GPU-compressed KTX2 textures.

Quick Start

Use the threejs-textures skill to configure a PBR material with an albedo map and an ORM texture for optimal performance.

Frequently Asked Questions about threejs-textures

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
Why do my Three.js PBR textures appear washed out or too bright?

Incorrect colour space configuration causes PBR textures to appear washed out in Three.js. You must correctly tag sRGB versus Linear colour spaces during texture loading to ensure proper visual fidelity and accurate rendering.

How do I optimize VRAM usage for large texture sets in web-based 3D rendering?

To optimize VRAM usage in web-based 3D rendering, implement GPU-compressed KTX2 texture formats and proper memory disposal techniques. This prevents performance drops and memory leaks by efficiently managing texture loading and unloading.

What is the best way to configure UV mapping and mipmaps for procedural DataTextures?

Configuring procedural DataTextures requires proper UV mapping and mipmap control to maintain visual fidelity. This approach ensures correct texture sampling and efficient rendering without relying on external image files.

Does this approach support loading complete PBR texture sets with albedo and ORM maps?

Yes, it supports loading complete PBR texture sets including albedo maps and ORM textures. Configuring these maps together optimizes material performance and ensures physically accurate rendering results.

When should I use KTX2 compression instead of standard image formats for textures?

Use KTX2 compression when standard image formats cause inefficient VRAM usage or performance drops. GPU-compressed formats significantly reduce memory overhead while maintaining high visual fidelity for complex web rendering.

How do I prevent memory leaks when dynamically loading and disposing of textures?

Prevent memory leaks by implementing proper memory disposal routines during texture loading and unloading. Explicitly disposing of unused textures from VRAM ensures stable performance in dynamic web-based 3D rendering environments.