A Visual Studio Code extension that provides a built-in viewer for GLTF or GLB files. This extension allows you to preview and interact with 3D models directly within VS Code.
Usage
Click on any .gltf .glb file in VS Code's explorer window
The file will be opened automatically in a new tab using the GLTF/GLB Viewer
If that doesn't happen, you can right click manually on the file and choose 'open with:' GLTF/GLB Viewer
From the "open with" menu, you can also configure the default viewer to be this one
Interact with the 3D model using your mouse:
Left click and drag to rotate
Right click and drag to pan
Scroll to zoom
Features
Inspect GLTF/GLB files directly in VS Code in a 3D viewer
Automatic file association with .gltf .glb files
Interactive 3D model viewing
DRACO compression support
KTX2 support (GPU Texture Compression)
Hierarchy, Animations, Textures, Materials, Geometries and Info panels
Play and stop individual animations
Visualize textures, their resolution, and their relationship and usage with the materials
Download textures
Get a quick general understanding of the number of geometries, vertices, materials, textures, animations, etc.
Camera auto focus focus on any object when clicked
Copy to properties to clipboard with a single click
Extra tools to visualize information like normals, object origins, and more.
Quick search through the hierarchy tree
Installation
Open VS Code
Go to the Extensions view (Ctrl+Shift+X / Cmd+Shift+X)
Start development mode:
Inside vscode with the folder open, press F5 to start the extension. This will open a new window with the extension running.
Under the hood, it will run the yarn start command. That builds and watches for changes in the src/ folder.
Build
To build the extension:
yarn build
Packaging
To package the extension into a VSIX file for distribution:
Install the VSCE (Visual Studio Code Extensions) tool globally:
npm install -g @vscode/vsce
Make sure your extension is built:
yarn build
Package the extension:
vsce package
This will create a .vsix file in your project directory. You can then:
Install it locally by running code --install-extension ohzi-vscode-glb-viewer-1.0.0.vsix
Upload it to the VS Code Marketplace for public distribution
Share it directly with other users for manual installation
Note: If you plan to publish to the VS Code Marketplace, you'll need to:
