Tutorials

Byte-sized knowledge.

Learn from our library of official mini-tutorials.

Background Effect

How to render sky, background images, and gradients.

Changing Material Properties at Runtime

Changing material properties at runtime with JavaScript for interaction or animation.

How to build XR-only Components

How to make components only activate during XR sessions.

Connect Wonderland Engine to Coding Agents via MCP

Wonderland Engine provides an MCP Server plugin to give Cursor, VSCode Copilot, Claude Code, Gemini CLI and other AI coding agents access to high-performance 3D web development. Let your coding agent import scenes, set up components and modify settings for you.

Create a Texture with Canvas2D

Painting your own textures at runtime with JavaScript Canvas.

Exporting Wonderland Engine Mesh as OBJ file

How to export Wonderland Engine Mesh as OBJ for debugging runtime generated meshes.

Exporting Models from Blender

Exporting GLB files from Blender for import in the Wonderland Editor.

Handling 3D Cursor Clicks

How to run JavaScript when an object is clicked with the 3D cursor (VR, AR & 3D).

Introduction to Texture Atlasses

How to use texture atlasses, when and how to increase or decrease their sizes.

Loading GLTF/GLB at Runtime

How to load GLTF or GLB files at runtime from URLs.

3D UI with React in Wonderland Engine

Tutorial on getting started with the React UI library for Wonderland Engine.

Rendering Simplified Chinese Characters

How to set up text rendering for Simplified Chinese fonts.

Spawning Objects at Runtime

How to create objects in JavaScript.

Streaming .bin files at Runtime

Loading Wonderland Engine .bin files at runtime.

Switching Scenes

How to switch scenes to load different levels or parts of a world.

Integrate the CrazyGames SDK

Wonderland Engine is an excellent choice for building highly performant 3D web games, because it is optimized to load fast and even runs well on iOS Safari. This tutorial will cover how to integrate CrazyGames platform services.

Integrate the VIVERSE Avatar SDK

Wonderland Engine is an excellent choice for building highly performant 3D web and WebXR games, because it is optimized to load fast and even runs well on iOS Safari. This tutorial covers how to integrate VIVERSE SDK services.

Writing Components in Typescript

How to set up Typescript for use in custom components.

Writing JavaScript Libraries

Tutorial on creating your own JavaScript libraries for Wonderland Engine.