threejs-syntax-materials
Installation
SKILL.md
threejs-syntax-materials
Quick Reference
Material Type Decision Tree
| Use Case | Material | Why |
|---|---|---|
| UI elements, unlit scenes | MeshBasicMaterial |
Cheapest, no light computation |
| Matte diffuse (low-end devices) | MeshLambertMaterial |
Fast diffuse, no specular |
| Legacy specular highlights | MeshPhongMaterial |
Blinn-Phong model, not physically correct |
| General-purpose 3D (recommended) | MeshStandardMaterial |
PBR metalness/roughness, industry standard |
| Glass, car paint, fabric, soap bubbles | MeshPhysicalMaterial |
Advanced PBR (clearcoat, transmission, sheen, iridescence) |
| Cartoon/anime style | MeshToonMaterial |
Discrete cel-shading steps |
| Sculpting previews, no lights | MeshMatcapMaterial |
Matcap texture, zero light setup |
| Debug normals | MeshNormalMaterial |
RGB = surface normal direction |
| Invisible shadow receiver | ShadowMaterial |
Transparent shadow catcher |
| Solid lines | LineBasicMaterial |
Simple colored lines |
| Dashed lines | LineDashedMaterial |
Requires line.computeLineDistances() |
Related skills