# Spline för webben: bädda in och exportera interaktiv 3D (https://spline.design/sv/web)

> Bädda in interaktiv 3D med webbkomponenten Spline Viewer, eller exportera dina scener som kod för Vanilla JS, React, Next.js, Three.js eller react-three-fiber.

# Interaktiv 3D, byggd för webben

Bädda in dina 3D-scener med en enda HTML-tagg, eller exportera dem som kod för **Vanilla JS, React, Next.js och Three.js**.

[Börja skapa](https://app.spline.design/signin)[Läs dokumentationen](https://docs.spline.design/exporting-your-scene/web/exporting-as-spline-viewer)

din-webbplats.se

Spline Viewer

## En tagg, vilken webbplats som helst

`<spline-viewer>` är en native webbkomponent, så den fungerar i Framer, Webflow, Squarespace, React, Svelte och ren HTML. Den känner av hela sidan, inte bara sin egen canvas: scener kan följa muspekaren, titta på den och animeras när du scrollar sidan.

[Läs mer om Spline Viewer](https://docs.spline.design/exporting-your-scene/web/exporting-as-spline-viewer)

main.js

```
import { Application } from '@splinetool/runtime';

// Render the scene on a canvas
const canvas = document.getElementById('canvas3d');
const app = new Application(canvas);

app.load('https://prod.spline.design/DGI6oWLNcrhyDwvi/scene.splinecode');

```

Kodexport

## Din 3D-scen, som kod

Exportera som Vanilla JS, React, Next.js, Three.js eller react-three-fiber. Kopiera koden, öppna den i CodeSandbox eller ladda ner filerna och hosta dem själv.

[Läs mer om kodexport](https://docs.spline.design/exporting-your-scene/web/exporting-as-code)

Mer för webben

## Från en länk till dina egna servrar

### Kod-API

Utlös händelser, uppdatera variabler och ändra objektegenskaper från din egen kod, i Vanilla JS, React och Next.js.

### Publika URL:er

Dela en scen som en länk, eller bädda in den i Notion, Webflow, WordPress med flera.

### Egen hosting

Ladda ner hela projektet, runtime inräknad, och servera det från dina egna servrar. På Enterprise-planen.

### WebGPU

Scener renderas med WebGPU och faller automatiskt tillbaka på WebGL där det inte finns.

## Börja bygga i 3D

Koppla din agent, bjud in ditt team och publicera din första 3D-scen redan i dag.

[Börja skapa](https://app.spline.design/signin)[Koppla din agent](https://spline.design/sv/mcp)

[Spline](https://spline.design/sv)

3D- och 2D-editorn för team och deras agenter. Publicera på webben, iOS och Android.

#### Fråga AI om Spline

#### Produkter

- [3D-design](https://spline.design/sv/3d-design)
- [Hana](https://spline.design/sv/hana)
- [Omma](https://omma.build)
- [3D-generering med AI](https://spline.design/sv/ai-generate)
- [Spline MCP](https://spline.design/sv/mcp)
- [Spline Arena](https://spline.design/sv/arena)
- [Priser](https://spline.design/sv/pricing)
- [Företag](https://spline.design/sv/enterprise)

#### Runtimes

- [Web](https://spline.design/sv/web)
- [iOS](https://spline.design/sv/ios)
- [Android](https://spline.design/sv/android)

#### Appar

- [Ladda ner](https://spline.design/sv/download)
- [Spline Mirror](https://spline.design/spline-mirror)
- [Ladda ner Spline Mirror](https://spline.design/download-mirror)

#### Lär dig

- [Docs](https://docs.spline.design/)
- [Academy](https://spline.design/sv/academy)
- [Spline API](https://www.npmjs.com/package/@splinetool/runtime)
- [Lösningar](https://spline.design/solutions)

#### Community

- [Spline Community](https://community.spline.design)
- [Blog](https://spline.design/sv/blog)
- [Ändringslogg](https://spline.design/sv/changelog)
- [Utbildning](https://spline.design/sv/education)
- [Contra](https://spline.design/contra)
- [Affiliate](https://spline.design/sv/affiliate)

#### Företaget

- [Kunder](https://spline.design/sv/customers)
- [Karriär](https://www.ycombinator.com/companies/spline/jobs)
- [Säkerhet](https://spline.design/sv/security)

#### Juridik

- [Villkor](https://spline.design/terms)
- [Integritet](https://spline.design/privacy)

#### Kontakt

- [help@spline.design](mailto:help@spline.design)
- [jobs@spline.design](mailto:jobs@spline.design)

© 2026 - Spline, Inc.