Top Related Projects
The official Open-Asset-Importer-Library Repository. Loads 40+ 3D-file-formats into one unified and clean data structure.
JavaScript 3D Library.
Babylon.js is a powerful, beautiful, simple, and open game and rendering engine packed into a friendly JavaScript framework.
Filament is a real-time physically based rendering engine for Android, iOS, Windows, Linux, macOS, and WebGL2
Universal Scene Description
The DirectX Tool Kit (aka DirectXTK) is a collection of helper classes for writing DirectX 11.x code in C++
Quick Overview
glTF (GL Transmission Format) is a royalty-free specification for the efficient transmission and loading of 3D scenes and models by applications. Developed by the Khronos Group, it is designed to be a "JPEG of 3D," providing a common, extensible format for 3D content that can be easily consumed by a wide range of applications and platforms.
Pros
- Efficient and fast loading of 3D content
- Widely supported across various 3D applications and engines
- Extensible format allowing for custom data and features
- Compact file size compared to other 3D formats
Cons
- Limited support for advanced rendering techniques in the core specification
- May require additional extensions for specific use cases
- Learning curve for developers new to 3D graphics
- Some legacy 3D applications may not support glTF natively
Code Examples
As glTF is a file format specification rather than a code library, there are no direct code examples. However, here are some examples of how you might work with glTF files using popular libraries:
Using Three.js to load a glTF model:
import * as THREE from 'three';
import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js';
const loader = new GLTFLoader();
loader.load('path/to/model.gltf', (gltf) => {
scene.add(gltf.scene);
}, undefined, (error) => {
console.error('An error occurred loading the model:', error);
});
Using the official glTF-Validator:
const validator = await import('@gltf-validator/gltf-validator');
const result = await validator.validateBytes(new Uint8Array(glTFData));
console.log(result.issues);
Getting Started
To get started with glTF:
- Choose a 3D modeling software that supports glTF export (e.g., Blender, Maya, 3ds Max).
- Create or import your 3D model.
- Export the model as a .gltf or .glb file.
- Use a glTF-compatible viewer or integrate the model into your application using a library that supports glTF (e.g., Three.js, Babylon.js).
For developers:
- Install a glTF loader for your preferred 3D engine or framework.
- Load the glTF file using the appropriate method for your chosen library.
- Render the loaded 3D content in your application.
Competitor Comparisons
The official Open-Asset-Importer-Library Repository. Loads 40+ 3D-file-formats into one unified and clean data structure.
Pros of assimp
- Supports a wide range of 3D file formats (40+)
- Provides a unified API for loading and processing various 3D asset types
- Offers post-processing capabilities for mesh optimization and scene manipulation
Cons of assimp
- Larger library size and potentially slower performance due to its broad support
- May introduce unnecessary complexity for projects focused on a single file format
- Less specialized for modern real-time 3D applications compared to glTF
Code Comparison
assimp:
Assimp::Importer importer;
const aiScene* scene = importer.ReadFile("model.obj", aiProcess_Triangulate);
if (scene) {
// Process the loaded scene
}
glTF:
tinygltf::Model model;
tinygltf::TinyGLTF loader;
std::string err;
loader.LoadASCIIFromFile(&model, &err, "model.gltf");
if (!err.empty()) {
// Handle error
}
Summary
assimp is a versatile library for importing various 3D file formats, offering broad support and post-processing capabilities. However, it may be overkill for projects focused on modern, efficient 3D asset pipelines. glTF, on the other hand, is specifically designed for real-time rendering and efficient transmission of 3D content, making it more suitable for web and mobile applications. The choice between the two depends on the specific requirements of your project and the range of file formats you need to support.
JavaScript 3D Library.
Pros of three.js
- Full-featured 3D graphics library for web applications
- Extensive documentation and large community support
- Includes a wide range of built-in geometries, materials, and effects
Cons of three.js
- Larger file size and potentially higher performance overhead
- Steeper learning curve for beginners
- Less focused on standardization and cross-platform compatibility
Code Comparison
three.js:
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
const renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
glTF:
{
"scene": 0,
"scenes": [{"nodes": [0]}],
"nodes": [{"mesh": 0}],
"meshes": [{
"primitives": [{
"attributes": {"POSITION": 0},
"indices": 1
}]
}]
}
The three.js example shows how to set up a basic 3D scene with a camera and renderer, while the glTF example demonstrates a simple JSON structure for describing 3D assets. three.js provides a complete rendering solution, whereas glTF focuses on standardizing 3D asset format for efficient transmission and loading across different platforms and applications.
Babylon.js is a powerful, beautiful, simple, and open game and rendering engine packed into a friendly JavaScript framework.
Pros of Babylon.js
- Full-featured 3D engine with built-in physics, audio, and animation systems
- Extensive documentation and active community support
- Cross-platform compatibility, including WebGL, WebGPU, and native platforms
Cons of Babylon.js
- Larger file size and potentially higher performance overhead
- Steeper learning curve for beginners due to its comprehensive feature set
- Less flexibility for custom rendering pipelines compared to lower-level APIs
Code Comparison
glTF (JSON structure):
{
"asset": { "version": "2.0" },
"scene": 0,
"scenes": [{ "nodes": [0] }],
"nodes": [{ "mesh": 0 }],
"meshes": [{ "primitives": [{ "attributes": { "POSITION": 0 } }] }]
}
Babylon.js (JavaScript):
const scene = new BABYLON.Scene(engine);
const camera = new BABYLON.FreeCamera("camera", new BABYLON.Vector3(0, 5, -10), scene);
const light = new BABYLON.HemisphericLight("light", new BABYLON.Vector3(0, 1, 0), scene);
const sphere = BABYLON.MeshBuilder.CreateSphere("sphere", { diameter: 2 }, scene);
While glTF is a file format for 3D content, Babylon.js is a full 3D engine. glTF focuses on efficient transmission and loading of 3D assets, while Babylon.js provides a complete framework for creating and rendering 3D scenes, including support for glTF import.
Filament is a real-time physically based rendering engine for Android, iOS, Windows, Linux, macOS, and WebGL2
Pros of Filament
- Comprehensive real-time physically based rendering (PBR) engine
- Cross-platform support for Android, iOS, Windows, macOS, and Linux
- Optimized for mobile devices with a focus on performance
Cons of Filament
- Steeper learning curve due to its complexity and low-level nature
- Less widespread adoption compared to glTF
- More focused on rendering, while glTF is a versatile 3D asset format
Code Comparison
glTF (JSON structure):
{
"asset": { "version": "2.0" },
"scene": 0,
"scenes": [{ "nodes": [0] }],
"nodes": [{ "mesh": 0 }],
"meshes": [{ "primitives": [{ "attributes": { "POSITION": 0 } }] }]
}
Filament (C++ API usage):
Engine* engine = Engine::create();
Renderer* renderer = engine->createRenderer();
Scene* scene = engine->createScene();
View* view = engine->createView();
Camera* camera = engine->createCamera();
glTF is a file format standard for 3D assets, while Filament is a rendering engine. glTF focuses on efficient transmission and loading of 3D content, whereas Filament provides a complete rendering solution. glTF has broader industry support and is easier to integrate, while Filament offers more control over the rendering process and is optimized for mobile platforms.
Universal Scene Description
Pros of OpenUSD
- More comprehensive scene description format, supporting complex hierarchies and relationships
- Better suited for large-scale production pipelines and collaborative workflows
- Supports time-based animation and layering of scene elements
Cons of OpenUSD
- Steeper learning curve due to its complexity and extensive feature set
- Larger file sizes and potentially slower processing times for simple scenes
- Less widespread adoption compared to glTF, especially in real-time applications
Code Comparison
OpenUSD example:
from pxr import Usd, UsdGeom
stage = Usd.Stage.CreateNew("example.usda")
xformPrim = UsdGeom.Xform.Define(stage, "/hello")
spherePrim = UsdGeom.Sphere.Define(stage, "/hello/world")
stage.Save()
glTF example:
const gltf = {
scene: 0,
scenes: [{ nodes: [0] }],
nodes: [{ mesh: 0 }],
meshes: [{ primitives: [{ attributes: { POSITION: 0 }, indices: 1 }] }],
bufferViews: [/* ... */],
accessors: [/* ... */],
buffers: [/* ... */]
};
OpenUSD offers a more expressive and hierarchical approach, while glTF provides a simpler, more compact representation better suited for real-time 3D applications.
The DirectX Tool Kit (aka DirectXTK) is a collection of helper classes for writing DirectX 11.x code in C++
Pros of DirectXTK
- Comprehensive toolkit for DirectX development, offering a wide range of utilities and helpers
- Actively maintained by Microsoft, ensuring compatibility with latest Windows and DirectX versions
- Includes high-level abstractions for common graphics tasks, simplifying DirectX programming
Cons of DirectXTK
- Limited to DirectX and Windows platforms, lacking cross-platform support
- Steeper learning curve compared to glTF, especially for beginners in graphics programming
- Focuses on low-level graphics programming, while glTF is more about 3D asset interchange
Code Comparison
DirectXTK (C++):
auto device = GetD3DDevice();
auto context = GetD3DDeviceContext();
CommonStates states(device);
SpriteBatch spriteBatch(context);
glTF (JSON):
{
"asset": { "version": "2.0" },
"scene": 0,
"scenes": [{ "nodes": [0] }],
"nodes": [{ "mesh": 0 }]
}
DirectXTK provides C++ classes for DirectX development, while glTF uses JSON to describe 3D scenes and models. DirectXTK is more focused on rendering and graphics programming, whereas glTF is primarily used for 3D asset interchange and scene description across various platforms and applications.
Convert designs to code with AI
Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.
Try Visual CopilotREADME
glTF⢠(GL Transmission Format) is a royalty-free specification for the efficient transmission and loading of 3D scenes and models by applications. glTF minimizes both the size of 3D assets, and the runtime processing needed to unpack and use those assets. glTF defines an extensible, common publishing format for 3D content tools and services that streamlines authoring workflows and enables interoperable use of content across the industry.
Specification
NOTE as of September 23, 2021, the glTF 2.0 Specification has been moved to AsciiDoc markup format.
Please provide spec feedback by submitting issues. For technical or art workflow questions, or to showcase your work, join the glTF forum. For quick questions, use the #gltf
channel in the Khronos Group Slack.
Quickstart
Overview
From github.com/javagl/gltfOverview/ |
PDF |
hardcopy |
Khronos reference cards
Japanese translation by Takuto Takahashi
For developers
- Sample models for testing runtime engines and content pipeline tools.
- glTF-Asset-Generator provides assets for robust importer validation.
- 100,000+ models under Creative Commons license on Sketchfab (check license for individual models).
- Drag-and-drop validator for verifying correctness of existing glTF files.
- glTF Tutorial Series
- Khronos glTF Sample Viewer with WebGL PBR shaders. (source code)
For artists
Preview tools
- Sketchfab
- PlayCanvas Viewer
- BabylonJS Sandbox
- Drag-and-drop viewer
- glTF VSCode Extension 3D previews, glTF validation, conversion to/from GLB
Contents
glTF Tools
Tools, applications and libraries for working with glTF can be found in the glTF Project Explorer.
Resources
- glTF-Generator-Registry - An open registry of tools that create glTF assets, along with structured metadata such as links to documentation and bug trackers.
Formats Built on glTF
- 3D Tiles - An open standard for streaming and rendering massive heterogenous 3D content.
- VRM - A 3D avatar format for VR applications.
Stack Overflow
- glTF tagged questions
Presentations and Articles
Intros
- glTF 2.0 Launch by Neil Trevett. June 2017
- glTF Webinar (video, slides) by Marco Hutter. February 2017
- glTF Brief by Tony Parisi, FormVR and Amanda Watson, Oculus. October 2016
Tutorials
All Presentations and Articles
- Streamlining 3D Commerce with Material Variant Support in glTF Assets by Daniel Beauchamp and Stephan Leroux at Shopify on behalf the 3D Commerce Working Group. November 2020
- Live glTF Asset Editing in Your BrowserâEven in AR by Emmett Lalish. August 2020
- View a glTF model in AR on Android without leaving your browser by Emmett Lalish. May 2020
- The glTF Model Authoring Pipeline video series on authoring glTF models in Blender, by Ed Mackey and Alex Wood. April 2020
- glTF Ecosystem Forum during SIGGRAPH. July 2019
- SIGGRAPH 2019 glTF BOF Video and slides
- Khronos: Ed Mackey - glTF Overview
- Facebook: Renee Rashid - Spark AR, glTF at Facebook
- Cesium: Omar Shehata - 3D Tiles, Basis Universal
- DGG: Max Limper - Automating the 3D Processing Pipeline
- Uber: Georgios Karnas - glTF in Big Data Visualization
- UX3D: Fabian Wahlster and Moritz Becher - glTF Editor and Tools
- Esri: David Körner - glTF with Esri JS API
- Sketchfab: Alban Denoyel - Publish & Find 3D Models Online
- Google: Adrian Perez - AR Search at Google
- Wayfair: Shrenik Sadalgi - Khronos 3D Commerce Working Group introduction
- How to make a PBR 3D model for the web by Arturo Paracuellos. June 2019
- Uberâs vis.gl brings glTF to geospatial data visualization by Georgios Karnas, Ib Green, Travis Gorkin, and Xintong Xia. June 2019
- Exporting glTF from Animate by Ram Kulkarni. April 2019
- glTF: Everything You Need to Know! by Ben Houston. April 2019
- GDC 2019 Khronos Developer Days - WebGL & glTF video. March 2019 (slides)
- Khronos: Patrick Cozzi - Overview
- Microsoft: Saurabh Bhatia - Ecosystem and SDK Update
- Google: Chris Joel -
<model-viewer>
Fidelity Testing - Adobe: Mike Bond - Adobe Dimension
- Mozilla: Robert Long - Publishing Virtual Worlds with glTF
- Facebook: Susie Su - An On-Demand, Optimizing glTF Backend
- glTF Debugging in Visual Studio Code by Gary Hsu. January 2019
- SIGGRAPH Asia glTF Overview and CTTF Update by Khronos. December 2018
- droidcon SF 2018 - The JPEG of 3D: Bringing 3D scenes and objects into your 2D Android app with glTF by Pierre LaFayette. November 2018
- Using the Babylon.js viewer with WebVR and Windows Mixed Reality home by Saurabh Bhatia. November 2018
- Behind the Scenes with Adobe Dimension Engineers: How We Built the 3D Publish Feature by Mike Bond. November 2018
- OGC and Khronos Form a Liaison to Improve Interoperability within the Geospatial and 3D Graphics Communities. October 2018
- If you build it (together), they will come...Mozilla and the Khronos Group collaborate to bring glTF capabilities to Blender by Rosana Ardila. October 2018
- glTF and Construction â Part 1: Secrets of the Cloud by Tim Davies. September 2018
- glTF and Construction â Part 2: 3D for Everyone by Tim Davies. September 2018
- SIGGRAPH 2018 glTF BOF video and materials. August 2018
- Ecosystem update: Patrick Cozzi, Cesium
- glTF for artists: Patrick Ryan, Microsoft
- TurboSquid: Beau Perschall
- Facebook: Pär Winzell
- Microsoft: Gary Hsu and Cedric Caillaud
- STK: Alex Wood, AGI
- VSCode: Ed Mackey, AGI
- Industrial AR with glTF: Johannes Beh, Fraunhofer
- Google Draco: Jamieson Brettle
- Texture transmission: Mark Callow
- IKEA: Martin Enthed
- glTF 2.0 â Status and Outlook by Norbert Nopper. July 2018
- TurboSquid adds glTF to supported formats for its StemCell initiative. July 2018
- Why glTF 2.0 is awesome! by Arthur Brainville. July 2018
- Get your glTF on with WebGL/WebVR at Microsoft - June 2018
- Meetup video
- Ecosystem update by Saurabh Bhatia (slides)
- 3D product displays on the web using glTF by Matthew Cedeno and Gary Hsu
- Publishing Virtual Worlds with glTF by Robert Long (slides)
- Compressed Texture Transmission Format by Mark Callow (slides)
- What's new with Draco 3D compression by Frank Galligan (slides)
- glTF at Adobe by Mike Bond
- Building the Metaverse One Standard at a Time by Neil Trevett. Web3D. June 2018
- Sketchfab uses glTF to bring a search bar to the world of 3D. May 2018
- Draco Compressed Meshes with glTF and 3D Tiles by Gabby Getz. April 2018
- glTF Momentum Accelerates with New Support from Facebook, Epic, Unity, and Adobe by Khronos. April 2018
- GDC 2018 Khronos Developer Days - WebGL & glTF video. March 2018
- glTF Ecosystem Update, GTC by Neil Trevett. March 2018
- glTF Ecosystem Update, GDC by Patrick Cozzi. March 2018
- Adobe Dimension & glTF by Mike Bond. March 2018
- Draco 3D Compression Extension to glTF 2.0 by Frank Galligan. March 2018
- Mixed Reality with glTF by Tom Mignone. March 2018
- glTF Texture Transmission Extension by David Wilkinson. March 2018
- glTF in Unreal Engine by Mike Erwin. March 2018
- glTF Asset Generator Deep Dive by Gary Hsu. March 2018
- GLB Tutorials (exporting from Modo, Substance Painter, Maya, and others) by Facebook. February 2018
- [Archived] Convert FBX format to glTF format on Blender and animate it with Three.js (Japanese) by Ryosuke Sakaki. February 2018
- Art Pipeline for glTF by Patrick Ryan. January 2018
- Call for Participation: glTF Creating a Compressed Texture Extension by Khronos. December 2017
- Using glTF Models with A-Frame by Josh Marinacci. December 2017
- Creating animated glTF Characters with Mixamo and Blender by Don McCurdy. November 2017
- State of glTF 2.0 for WebVR Devs by Don McCurdy, Google. September 2017
- glTF Exporter in three.js and A-Frame by Fernando Serrano. August 2017
- SIGGRAPH 2017 glTF BOF video. August 2017
- glTF 2.0 and Community Update: Tony Parisi, Unity, and Patrick Cozzi, Cesium
- Microsoft update - Paint 3D, View 3D, 3D in Office and one more thingâ¦: Saurabh Bhatia and Gary Hsu, Microsoft
- glTF VSCode editor: Ed Mackey, AGI
- Autodesk Forge and glTF: Nop Jiarathanakul, Autodesk
- Three.js and A-Frame update: Don McCurdy, Google and Ricardo Cabello, Google
- Introduction to geometry compression on the web with Draco: Michael Hemmer and Jamieson Brettle, Google
- WebGL PBR reference implementation: Scott Nagy, Microsoft, and Mohamad Moneimne, Cesium
- Sketchfab update: Aurelien Chatelain, Sketchfab
- glTF 2.0 Export in InstantUV: Max Limper, Fraunhofer
- Physically-Based Rendering in Cesium by Mohamad Moneimne. August 2017
- Why we should all support glTF 2.0 as THE standard asset exchange format for game engines by Juan Linietsky. August 2017
- Exporting glTF 2.0 from Maya LT by Don McCurdy. June 2017
- glTF 2.0: PBR Materials by Saurabh Bhatia. May 2017
- glTF Workflow for a Saturday Night by Diego F. Goberna. April 2017
- 2017 GDC WebGL/WebVR/glTF Meetup YouTube recording. March 2017
- Reach the Largest Gaming Platform of All: The Web. WebGL, WebVR and glTF. March 2017
- PBR-ready glTF in instant3Dhub / instantUV by Max Limper. March 2017
- Call for feedback on glTF 2.0 by Neil Trevett. February 2017
- [Archived] Improve expressiveness of WebGL with the topic 3D file format glTF now! (in Japanese) by Yuki Shimada(@emadurandal), WebGL advent calendar 2016 at Qiita. December 2016
- Bringing 3D to everyone through open standards by Forest W. Gouin and Jean Paoli. October 2016
- Using Quantization with 3D Models by Rob Taglang. August 2016
- glTF and Mobile VR: Inclusive standards for a 3D world. Amanda Watson, Oculus, WebGL + glTF BOF. July 2016
- glTF Update and Roadmap. Tony Parisi, WebGL + glTF BOF. July 2016
- PBR in glTF: Current State. Max Limper, Johannes Behr, and Timo Sturm, WebGL + glTF BOF. July 2016
- glTF: The Runtime Asset Format for GL-based Applications. July 2016
- glTF working group updates (slides, video). Patrick Cozzi and Tony Parisi, WebGL + glTF BOF. March 2016
- FBX to/from glTF (slides, video). Cyrille Fauvel, WebGL + glTF BOF. March 2016
- Khronos Group glTF Webinar. Neil Trevett, Virtual AR Community meeting. October 2015
- An Introduction to glTF 1.0. October 2015
- The state of WebGL and glTF. Patrick Cozzi, The Graphical Web. September 2015
- glTF ecosystem and mesh compression update. Khronos 3D Formats Working Group, SIGGRAPH 2015. August 2015
- glTF and the WebGL Art Pipeline. Tony Parisi, WebGL Meetup. March 2015
- Writing an FBX importer / Exporter plug-in. Cyrille Fauvel. January 2015
- glTF Tips for Artists. Branden Coker. December 2014
- 3D for the Modern Web: Declarative 3D and glTF. Brian Coughlin. Summer 2014
- glTF: Designing an Open-Standard Runtime Asset Format. Fabrice Robinet et al, GPU Pro 5. May 2014
- Building a WebGL Santa with Cesium and glTF. Patrick Cozzi. December 2013
- glTF update. Tony Parisi. August 2013
- [Archived] How I got involved in glTF and Khronos. Patrick Cozzi, WebGL Meetup. March 2013
We believe the true usefulness of glTF goes beyond the spec itself; it is an ecosystem of tools, documentation, and extensions contributed by the community. You are encouraged to get involved!
Top Related Projects
The official Open-Asset-Importer-Library Repository. Loads 40+ 3D-file-formats into one unified and clean data structure.
JavaScript 3D Library.
Babylon.js is a powerful, beautiful, simple, and open game and rendering engine packed into a friendly JavaScript framework.
Filament is a real-time physically based rendering engine for Android, iOS, Windows, Linux, macOS, and WebGL2
Universal Scene Description
The DirectX Tool Kit (aka DirectXTK) is a collection of helper classes for writing DirectX 11.x code in C++
Convert designs to code with AI
Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.
Try Visual Copilot