Three.js 재질별 material 속성 정리

Three.js 재질별 material 속성 정리

플라스틱: metalness: 0, roughness: 0.2 ~ 0.4

const plasticMaterial = new THREE.MeshStandardMaterial({
  color: 0xff0000, // 원하는 색상
  metalness: 0,
  roughness: 0.3,
});

메탈: metalness: 1, roughness: 0 ~ 0.3

const metalMaterial = new THREE.MeshStandardMaterial({
  color: 0xaaaaaa, // 금속의 기본 색상 (은색, 철색 등)
  metalness: 1,
  roughness: 0.2,
});

유리: metalness: 0, roughness: 0, opacity: 0.1 ~ 0.3, transparent: true

const glassMaterial = new THREE.MeshStandardMaterial({
  color: 0x88ccff, // 약간의 색을 가진 투명 유리
  metalness: 0,
  roughness: 0,
  opacity: 0.1, // 매우 투명
  transparent: true,
  envMapIntensity: 1, // 환경 맵의 영향을 받도록 설정
});

시멘트: metalness: 0, roughness: 0.8 ~ 1.0

const cementMaterial = new THREE.MeshStandardMaterial({
  color: 0x888888, // 시멘트의 회색
  metalness: 0,
  roughness: 0.9,
});

목재: metalness: 0, roughness: 0.5 ~ 0.7

const woodMaterial = new THREE.MeshStandardMaterial({
  color: 0x8B4513, // 나무의 갈색
  metalness: 0,
  roughness: 0.6,
});

고무: metalness: 0, roughness: 0.7 ~ 0.9

const rubberMaterial = new THREE.MeshStandardMaterial({
  color: 0x333333, // 고무의 검은색
  metalness: 0,
  roughness: 0.8,
});

도자기: metalness: 0, roughness: 0.2 ~ 0.4

const ceramicMaterial = new THREE.MeshStandardMaterial({
  color: 0xffffff, // 도자기의 흰색
  metalness: 0,
  roughness: 0.3,
});

천: metalness: 0, roughness: 0.7 ~ 1.0

const fabricMaterial = new THREE.MeshStandardMaterial({
  color: 0x555555, // 천의 회색
  metalness: 0,
  roughness: 0.9,
});

가죽: metalness: 0, roughness: 0.4 ~ 0.6

const leatherMaterial = new THREE.MeshStandardMaterial({
  color: 0x3B2F2F, // 가죽의 갈색
  metalness: 0,
  roughness: 0.5,
});

고광택 플라스틱: metalness: 0, roughness: 0.1 ~ 0.2

const glossyPlasticMaterial = new THREE.MeshStandardMaterial({
  color: 0xff0000, // 원하는 색상
  metalness: 0,
  roughness: 0.1,
});

거울: metalness: 1, roughness: 0

const mirrorMaterial = new THREE.MeshStandardMaterial({
  color: 0xffffff,
  metalness: 1,
  roughness: 0,
  envMapIntensity: 1, // 환경 맵의 반사를 극대화
});

컴퓨터를 표현하기 위한 재질

 

금속 부분 (Metal Case): metalness: 1, roughness: 0.3 ~ 0.6

const metalCaseMaterial = new THREE.MeshStandardMaterial({
  color: 0x888888, // 금속의 기본 회색 또는 은색
  metalness: 1,
  roughness: 0.4, // 약간의 거친 표면
});

고광택 플라스틱: metalness: 0, roughness: 0.1 ~ 0.2

const glossyPlasticMaterial = new THREE.MeshStandardMaterial({
  color: 0x000000, // 검은색 플라스틱
  metalness: 0,
  roughness: 0.1, // 매끄럽고 반사도가 높은 표면
});

매트한 플라스틱: metalness: 0, roughness: 0.4 ~ 0.6

const mattePlasticMaterial = new THREE.MeshStandardMaterial({
  color: 0x111111, // 어두운 매트 플라스틱
  metalness: 0,
  roughness: 0.5, // 매트하고 덜 반사되는 표면
});

고무 재질 (Rubber Feet): metalness: 0, roughness: 0.8 ~ 0.9

const rubberFeetMaterial = new THREE.MeshStandardMaterial({
  color: 0x333333, // 어두운 고무
  metalness: 0,
  roughness: 0.85,
});