Your first spatial experience

1. Install

Start with a SvelteKit application. Install the component package and its Three.js peer dependency:

sh
npm install @spatial-elements/sveltekit@beta three@^0.186.1

2. Compose

Put one BrandStageShell in the layout shared by your collection and detail pages. Define an element with an ID, title, GLB geometry, HDR environment and fallback poster.

Use ContentPage with a HeadingSection and SpatialCardGridSection for the collection. Use SpatialElementPage for each detail route.

Follow the complete example with route files and code →

3. Explore

The minimal demo is a small working starting point. Explore the showcase for richer examples and the documentation for the details.