> For the complete documentation index, see [llms.txt](https://docs.poweredbybackstage.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.poweredbybackstage.com/modules/spline.md).

# Spline

Allows a Spline 3D scene to be integrated into a Flux site.

<figure><img src="https://2635135911-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F9NyC60xfSabdCmQW0heP%2Fuploads%2FsWM0xAQLlcm62vV9jfXV%2Fimage.png?alt=media&amp;token=f901208b-ad37-4896-ad82-3d1cd82a04b5" alt=""><figcaption><p>A Simple Spline Scene</p></figcaption></figure>

The Spline module allows Flux sites to natively embed and interact with [Spline scenes](https://spline.design/).

## Properties

### URL

The URL of the SplineCode for the Scene.&#x20;

See [Finding the SplineCode](#finding-the-splinecode-for-a-scene) for more details on where to find this.

***

## Nodes: Broadcasters

### Spline:onEvent

<figure><img src="https://2635135911-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F9NyC60xfSabdCmQW0heP%2Fuploads%2F84IglMoDy3wTDOrArA0U%2Fimage.png?alt=media&amp;token=6fa34048-2db8-46e5-b662-e1201a4cb445" alt=""><figcaption></figcaption></figure>

Fires when the Spline scene triggers an event.

| Field             | Type        | Description                                                                                                                                                                    |
| ----------------- | ----------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| Spline Event Type | SplineEvent | The type of SplineEvent that was triggered. A list of event types [can be found in the Spline Documentation.](https://www.npmjs.com/package/@splinetool/runtime#spline-events) |
| Object            | String      | The name of the Spline Object where the event occurred.                                                                                                                        |

## Nodes: Listeners

### Spline:setUrl

<figure><img src="https://2635135911-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F9NyC60xfSabdCmQW0heP%2Fuploads%2F9IzoyPNhjNdkJB2FEqV4%2Fimage.png?alt=media&amp;token=282d952f-d4ab-4734-bdc7-715177d89252" alt=""><figcaption></figcaption></figure>

When triggered, changes the currently loaded Spline scene.

| Field | Type   | Description                                      |
| ----- | ------ | ------------------------------------------------ |
| URL   | String | The SplineCode for the new Spline scene to load. |

### Spline:setVariable

<figure><img src="https://2635135911-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F9NyC60xfSabdCmQW0heP%2Fuploads%2FiNs5jAvCHrz4QgB60OR8%2Fimage.png?alt=media&amp;token=04824f52-9af2-45d1-824d-815c81ef8dd7" alt=""><figcaption></figcaption></figure>

When triggered, sets a Spline variables to the specified Value.

| Field                | Type                        | Description                              |
| -------------------- | --------------------------- | ---------------------------------------- |
| Spline Variable Name | String                      | The name of the Spline Variable to set   |
| Value                | String \| Number \| Boolean | The value to set the Spline Variable to. |

### Spline:triggerEvent

<figure><img src="https://2635135911-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F9NyC60xfSabdCmQW0heP%2Fuploads%2FaPutRa6ByfRcQ91VneKC%2Fimage.png?alt=media&amp;token=a38c3595-8cc7-46b6-bbd4-cd781dd98a6e" alt=""><figcaption></figcaption></figure>

When triggered, triggers a Spline Event in the target Spline Scene.

| Field      | Type        | Description                                                                                                                                                                                     |
| ---------- | ----------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Event Type | SplineEvent | The type of Spline Event to trigger in the target Scene. A list of accepted values can be found [in the Spline Documentation.](https://www.npmjs.com/package/@splinetool/runtime#spline-events) |
| Object     | String      | The name of the Spline Object to trigger the Event on.                                                                                                                                          |

## Guides

### Finding the SplineCode for a Scene

{% embed url="<https://app.arcade.software/share/5kkuOfiUTJs66hYyxuH3>" %}

1. Open a Spline Scene
2. Click **"Export"** in the top toolbar.
3. Select **"Viewer"**
4. Copy the scene link at the top. It should look like:

```
prod.spline.design/kdQpJNHWdLyIY6fZ/scene.splinecode
```

### Updating a Spline Scene

When making changes to your Spline Scene, you must update the export before changes will appear in the Flux module.

1. Update your Spline Scene (e.g. change the color of an object)
2. Click **"Export"** in the top toolbar.
3. Select **"Viewer"**
4. Click "**Update Viewer"** and wait until the loading spinner disappears