Skip to content

Reon90/redcube

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation


redcube
RedCube

The GLTF viewer with WebGL2 and WebGPU backends.


npm downloads typescript last commit size eslint


The javascript rendering library for Khronos glTF 2.0 format.

Features

• glTF 2.0 Specification

• KHR_draco_mesh_compression

• KHR_materials_dispersion

KHR_materials_dispersion

• KHR_materials_anisotropy

KHR_materials_anisotropy

• KHR_materials_diffuse_transmission

KHR_materials_diffuse_transmission

• KHR_materials_diffuse_transmission + subsurface scatering

sss

• KHR_lights_punctual

KHR_lights_punctual

• KHR_materials_clearcoat

KHR_materials_clearcoat

• KHR_materials_pbrSpecularGlossiness

• KHR_materials_sheen

KHR_materials_sheen

• KHR_materials_transmission

KHR_materials_transmission

• KHR_materials_volume

KHR_materials_volume

• KHR_materials_emissive_strength

• KHR_materials_iridescence

KHR_materials_iridescence

• KHR_materials_unlit

• KHR_materials_variants

KHR_materials_variants

• KHR_mesh_quantization

• KHR_texture_basisu

• KHR_texture_transform

• EXT_lights_image_based

EXT_lights_image_based

• KHR_materials_ior

KHR_materials_ior

Check list

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 100,000+ models

Usage

<canvas style="width: 600px; height: 600px;"></canvas>

const renderer = new RedCube('./box.gltf', canvas);
renderer.init(() => {
    console.log('loaded');
});

Install

npm install redcube.js