Babylon.js
Babylon.js is a powerful, open-source web rendering engine for 3D graphics. It provides a complete framework for building 3D experiences in the browser with features like physics, audio, and GUI.
In This Section
- Getting Started — Scene, camera, lights, and meshes
- Materials & Textures — PBR materials, texture maps, and environment lighting
- Animation & Physics — Animation groups, skeletal animation, and physics engine
- GUI & Interaction — GUI system, picking, and action manager
- Importing & Exporting — glTF/GLB import, scene export, and asset management
Pages in this section
Babylon.js Getting Started — Build Your First 3D Scene in the Browser
Learn Babylon.js from scratch: engine, scene, cameras, lights, meshes, materials, and the render loop. Step-by-step with an interactive 3D scene explorer you can run right now.
✓ LiveBabylon.js Materials & Textures Explained — Realistic 3D Surfaces
Master Babylon.js materials: StandardMaterial vs PBR, texture maps, HDR environment lighting, skyboxes, UV coordinates, and procedural textures. Step-by-step with interactive material studio.
✓ LiveBabylon.js Animation & Physics — Bring Your 3D Scene to Life
Learn Babylon.js animation and physics: keyframe animation, easing functions, AnimationGroup, skeletal animation, Havok physics, impostors, forces, and collisions. Step-by-step with interactive physics playground.
✓ LiveBabylon.js GUI & Interaction — Build Interactive 3D Applications
Learn Babylon.js GUI and interaction: AdvancedDynamicTexture, buttons, panels, pointer events, ActionManager for mesh picking, 3D UI on meshes, and HTML overlays. Step-by-step with interactive dashboard.
✓ LiveBabylon.js Importing & Asset Management — glTF, GLB, and Optimization
Learn to import 3D models in Babylon.js: SceneLoader.ImportMesh, AssetContainer for preloading, glTF/GLB support, Draco compression, loading progress, mesh optimization, KTX2 textures, and scene export. Step-by-step with interactive 3D asset viewer.
✓ Live