와이어프레임

import * as THREE from 'three';
const renderer = new THREE.WebGLRenderer({ antialias: true });
renderer.setPixelRatio(Math.min(devicePixelRatio, 2));
document.body.appendChild(renderer.domElement);
const scene = new THREE.Scene();
scene.background = new THREE.Color(0x0b0b14);
const camera = new THREE.PerspectiveCamera(45, 1, 0.1, 100);
camera.position.set(0, 0.8, 6);
const geo = new THREE.TorusKnotGeometry(1.15, 0.38, 140, 16);
const fill = new THREE.Mesh(geo, new THREE.MeshBasicMaterial({ color: 0x2a2a52, transparent: true, opacity: 0.35 }));
scene.add(fill);
const wire = new THREE.LineSegments(new THREE.WireframeGeometry(geo), new THREE.LineBasicMaterial({ color: 0x8ecbff, transparent: true, opacity: 0.85 }));
scene.add(wire);
function resize() { renderer.setSize(innerWidth, innerHeight); camera.aspect = innerWidth / innerHeight; camera.updateProjectionMatrix(); }
addEventListener('resize', resize); resize();
renderer.setAnimationLoop((t) => {
  const r = t * 0.00022;
  fill.rotation.set(r * 0.6, r, r * 0.15);
  wire.rotation.copy(fill.rotation);
  renderer.render(scene, camera);
});