ATLASDESIGN REFERENCE GALLERY
ATLAS GALLERY / 2026.10

웹 3D·그래픽·XR 라이브러리

각 항목을 클릭하면 시각 예시·비교·원문을 볼 수 있습니다.

Three.js Three.js

장면·카메라·재질·기하 등으로 웹 3D를 구성하는 라이브러리.

3D 상품 뷰어·부스 배치·인터랙티브 웹.

WebGL·WebGPU 렌더러와 기능별 지원 차이를 확인한다.

참고 문서

Babylon.js Babylon.js

실시간 3D·재질·애니메이션·도구 기능을 제공하는 웹 엔진.

웹 3D 앱·게임·제품 시각화.

도입 전 공식 문서에서 지원 버전·배포 플랫폼·라이선스·유지보수 상태를 확인한다.

참고 문서

React Three Fiber React Three Fiber

Three.js 장면을 React 컴포넌트 모델로 구성하는 렌더러.

React 기반 3D 편집기·뷰어.

Three.js 자체를 대체하는 별도 3D 엔진은 아니다.

참고 문서

Drei Drei

컨트롤·환경·텍스트 등 자주 쓰는 R3F 보조 기능 모음.

3D 제품·씬 UI 구현 보조.

도입 전 공식 문서에서 지원 버전·배포 플랫폼·라이선스·유지보수 상태를 확인한다.

참고 문서

React Three Rapier React Three Rapier

R3F 장면에 Rapier 물리 상태를 연결하는 도구.

React 기반 물리 3D 장면.

도입 전 공식 문서에서 지원 버전·배포 플랫폼·라이선스·유지보수 상태를 확인한다.

참고 문서

postprocessing postprocessing

Three.js 렌더링에 합성·화면 효과를 구성하는 도구.

블룸·색 조정·화면 효과.

Three.js용 라이브러리의 제품명이다. 일반 렌더링 단계인 Post-processing과 구분한다.

참고 문서

three-mesh-bvh three-mesh-bvh

메시 BVH를 생성해 레이 교차·공간 질의를 돕는 도구.

복잡한 모델 선택·충돌 질의.

도입 전 공식 문서에서 지원 버전·배포 플랫폼·라이선스·유지보수 상태를 확인한다.

참고 문서

OGL OGL

WebGL의 기본 기능을 간결한 추상화로 제공하는 3D 도구.

맞춤 셰이더·가벼운 그래픽 실험.

도입 전 공식 문서에서 지원 버전·배포 플랫폼·라이선스·유지보수 상태를 확인한다.

참고 문서

regl regl

WebGL 상태와 그리기 명령을 선언형으로 구성하는 도구.

맞춤 GPU 시각화.

도입 전 공식 문서에서 지원 버전·배포 플랫폼·라이선스·유지보수 상태를 확인한다.

참고 문서

A-Frame A-Frame

HTML 기반 엔티티·컴포넌트로 3D·XR 장면을 구성하는 프레임워크.

웹 VR·공간 프로토타입.

도입 전 공식 문서에서 지원 버전·배포 플랫폼·라이선스·유지보수 상태를 확인한다.

참고 문서

model-viewer model-viewer

3D 모델 표시와 제품형 카메라 상호작용을 제공하는 웹 컴포넌트.

상품 상세페이지의 3D 뷰어.

AR 등 기능은 기기·브라우저별 지원을 확인한다.

참고 문서

GaussianSplats3D GaussianSplats3D

가우시안 스플랫 장면을 Three.js 기반으로 표시하는 도구.

캡처한 공간·스플랫 뷰어.

스플랫은 일반 메시와 충돌·편집 방식이 다르다.

참고 문서

wgpu wgpu

여러 그래픽 백엔드를 추상화하는 GPU API 라이브러리.

Rust 렌더러·크로스플랫폼 그래픽.

도입 전 공식 문서에서 지원 버전·배포 플랫폼·라이선스·유지보수 상태를 확인한다.

참고 문서

ModernGL ModernGL

OpenGL을 Python에서 비교적 간결하게 사용하는 인터페이스.

Python 셰이더·GPU 렌더링 실험.

도입 전 공식 문서에서 지원 버전·배포 플랫폼·라이선스·유지보수 상태를 확인한다.

참고 문서

pyglet pyglet

윈도·입력·그래픽·미디어 기능을 제공하는 Python 멀티미디어 라이브러리.

2D·3D·미디어 앱.

도입 전 공식 문서에서 지원 버전·배포 플랫폼·라이선스·유지보수 상태를 확인한다.

참고 문서

Web 3D, Graphics & XR Libraries

Open an entry for its visual reference, comparisons and source-language text.

Three.js Three.js

A library building web 3D with scenes, cameras, materials, and geometry.

3D product viewers, booth layout tools, and interactive websites.

Check feature differences between WebGL and WebGPU renderers.

Reference

Babylon.js Babylon.js

A web engine providing real-time 3D, materials, animation, and supporting tools.

Web 3D applications, games, and product visualization.

Before adoption, check official documentation for supported versions, distribution platforms, licensing, and maintenance status.

Reference

React Three Fiber React Three Fiber

A renderer composing Three.js scenes through React's component model.

React-based 3D editors and viewers.

This is not an independent 3D engine replacing Three.js.

Reference

Drei Drei

A collection of common React Three Fiber helpers for controls, environments, text, and more.

Helpers for 3D product and scene interfaces.

Before adoption, check official documentation for supported versions, distribution platforms, licensing, and maintenance status.

Reference

React Three Rapier React Three Rapier

A toolkit connecting Rapier physics state to React Three Fiber scenes.

React-based 3D physics scenes.

Before adoption, check official documentation for supported versions, distribution platforms, licensing, and maintenance status.

Reference

postprocessing postprocessing

A toolkit composing post-processing and screen effects for Three.js rendering.

Bloom, color adjustments, and screen effects.

This is a product name for a Three.js library, distinct from the generic post-processing rendering stage.

Reference

three-mesh-bvh three-mesh-bvh

A toolkit creating mesh BVHs to support ray intersections and spatial queries.

Complex-model selection and collision queries.

Before adoption, check official documentation for supported versions, distribution platforms, licensing, and maintenance status.

Reference

OGL OGL

A 3D toolkit exposing core WebGL functionality through concise abstractions.

Custom shaders and lightweight graphics experiments.

Before adoption, check official documentation for supported versions, distribution platforms, licensing, and maintenance status.

Reference

regl regl

A toolkit declaring WebGL state and drawing commands.

Custom GPU visualizations.

Before adoption, check official documentation for supported versions, distribution platforms, licensing, and maintenance status.

Reference

A-Frame A-Frame

A framework constructing 3D and XR scenes with HTML-based entities and components.

Web VR and spatial prototypes.

Before adoption, check official documentation for supported versions, distribution platforms, licensing, and maintenance status.

Reference

model-viewer model-viewer

A web component displaying 3D models with product-viewer-style camera interactions.

3D viewers on product pages.

Check device and browser support for features such as AR.

Reference

GaussianSplats3D GaussianSplats3D

A toolkit displaying Gaussian-splat scenes using Three.js.

Viewers for captured spaces and Gaussian splats.

Splats differ from ordinary meshes in collision handling and editing.

Reference

wgpu wgpu

A GPU API library abstracting multiple graphics backends.

Rust renderers and cross-platform graphics.

Before adoption, check official documentation for supported versions, distribution platforms, licensing, and maintenance status.

Reference

ModernGL ModernGL

A relatively concise Python interface to OpenGL.

Python shader and GPU-rendering experiments.

Before adoption, check official documentation for supported versions, distribution platforms, licensing, and maintenance status.

Reference

pyglet pyglet

A Python multimedia library providing windows, input, graphics, and media capabilities.

2D, 3D, and media applications.

Before adoption, check official documentation for supported versions, distribution platforms, licensing, and maintenance status.

Reference