https://github.com/reon90/redcube
JS renderer based on GLTF to WebGPU or WebGL backends.
https://github.com/reon90/redcube
3d-models glsl gltf opengl-es pbr typescript webgl webgl2 webgpu
Last synced: 7 months ago
JSON representation
JS renderer based on GLTF to WebGPU or WebGL backends.
- Host: GitHub
- URL: https://github.com/reon90/redcube
- Owner: Reon90
- License: mit
- Created: 2017-05-21T14:01:14.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2025-02-04T06:06:07.000Z (9 months ago)
- Last Synced: 2025-03-29T06:05:19.354Z (7 months ago)
- Topics: 3d-models, glsl, gltf, opengl-es, pbr, typescript, webgl, webgl2, webgpu
- Language: TypeScript
- Homepage:
- Size: 43.4 MB
- Stars: 107
- Watchers: 9
- Forks: 7
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
RedCube
The GLTF viewer with WebGL2 and WebGPU backends.
The javascript rendering library for [Khronos glTF 2.0 format](https://github.com/KhronosGroup/glTF/tree/master/specification/2.0).
## Features
• glTF 2.0 Specification
• KHR_draco_mesh_compression
• KHR_materials_dispersion
• KHR_materials_anisotropy
• KHR_materials_diffuse_transmission
• KHR_materials_diffuse_transmission + subsurface scatering
• KHR_lights_punctual
• KHR_materials_clearcoat
• KHR_materials_pbrSpecularGlossiness
• KHR_materials_sheen
• KHR_materials_transmission
• KHR_materials_volume
• KHR_materials_emissive_strength
• KHR_materials_iridescence
• KHR_materials_unlit
• KHR_materials_variants
• KHR_mesh_quantization
• KHR_texture_basisu
• KHR_texture_transform
• EXT_lights_image_based
• KHR_materials_ior
[Check list](https://github.com/cx20/gltf-test)
## Platforms
• Browsers with WebGL 2.0 support
• Browsers with WebGPU support (Chrome 113 and above)
• Node.js renderless
## How to convert 3D model to gltf
• Blender 2.80 File -> Export -> glTF 2.0
• [Sketchfab](https://sketchfab.com/models?features=downloadable&sort_by=-likeCount) 100,000+ models
## Usage
```js
const renderer = new RedCube('./box.gltf', canvas);
renderer.init(() => {
console.log('loaded');
});
```
## Install
```
npm install redcube.js
```