# Five SDK

Render captured spaces, control the camera, handle spatial interactions, and export images with the published Five SDK.

Canonical: https://developer.realsee.ai/docs/five-sdk
Source: https://developer.realsee.ai/docs/five-sdk.md
Language: en

[Download examples](https://developer.realsee.ai/starters/react-five/1.3.0/starter.zip)

Build a spatial viewer with Five SDK. Start with one working React + TypeScript project, then add the capability your app needs.

Use Five SDK **6.9.2**, Three.js **0.117.1**, React **18.3.1**, and Node **24** for the starter and extension examples.

## Start with a result

[Run the public scene](https://developer.realsee.ai/docs/five-sdk/quickstart) without an account or keys. The same starter also supports [server-side Team data](https://developer.realsee.ai/docs/open-api/quickstart).

Open the starter's **SDK examples** page to explore camera movement, modes, picking, labels, and image capture. Each guide below points to the actual source file included in that project.

## Choose a capability

| Goal | Guide | Public API used |
| --- | --- | --- |
| Load Work and release resources | [Load a scene](https://developer.realsee.ai/docs/five-sdk/load-a-scene) | `parseWork`, `appendTo`, `load`, `refresh`, `dispose` |
| Change view, viewpoint, or camera | [Camera and modes](https://developer.realsee.ai/docs/five-sdk/camera-and-modes) | `changeMode`, `moveToPano`, `updateCamera`, `getCurrentState` |
| React to taps and place a label | [Events and coordinates](https://developer.realsee.ai/docs/five-sdk/events-and-coordinates) | `on`, `model.intersectRaycaster`, `project2d` |
| Export the current frame | [Capture an image](https://developer.realsee.ai/docs/five-sdk/capture-images) | `getSize`, `getPixels` |
| Mount inside a React app | [React lifecycle](https://developer.realsee.ai/docs/five-sdk/react-lifecycle) | component mount, cancellation, resize, cleanup |
| Connect a deployed app | [Production checklist](https://developer.realsee.ai/docs/five-sdk/production) | assets, server authorization, browser resources |
| Find a method or event | [API map](https://developer.realsee.ai/docs/five-sdk/api-reference) | fixed-version types and package AI guides |

Dnalogel adds [spatial UI and measurement](https://developer.realsee.ai/docs/dnalogel). Vreo adds [narrative playback](https://developer.realsee.ai/docs/vreo). Live adds [room-based synchronization](https://developer.realsee.ai/docs/live). These products have their own dependency and service requirements.

## Versioned sources

- [Five SDK 6.9.2 package metadata](https://www.npmjs.com/package/@realsee/five/v/6.9.2)
- [Public API declarations](https://unpkg.com/@realsee/five@6.9.2/five/index.d.ts)
- [Package AI index](https://unpkg.com/@realsee/five@6.9.2/llms.txt)

Use the versioned API declarations for method signatures, event payloads, and type definitions.