Getting Started

Introduction

Threlte is a renderer and component library for using Three.js in a declarative and state-driven way in Svelte apps. It provides strictly typed components for deep reactivity and interactivity out-of-the-box.

Threlte is comprised of six distinct packages to allow you to import only what you need:

  • @threlte/core is the heart of Threlte, providing simple transparent Svelte binding to Three.js:

    • <T> is the main building block of any Threlte application. It is a thin wrapper around any Three.js object and provides a declarative API to build and render your Threlte app.

    • Plugins make it easy to extend Threlte with custom code and logic. Whether you want to implement an ECS or add a single property to every instance of <T>, plugins are the way to go.

  • @threlte/extras is a collection of plugins and components that extend Threlte with additional functionality.

  • @threlte/gltf is a command-line tool that turns GLTF assets into declarative and re-usable Threlte components.

  • @threlte/rapier provides components to enable performant physics in your Threlte application through the Rapier engine

  • @threlte/theatre provides components to enable animations in your Threlte application through the Theatre.js animation library

  • @threlte/xr provides components for VR and AR.

  • @threlte/flex provides components to easily use the flex engine yoga-layout with Threlte.