# Spline pro web: vkládejte a exportujte interaktivní 3D (https://spline.design/cs/web)

> Vkládejte interaktivní 3D pomocí webové komponenty Spline Viewer, nebo exportujte své scény jako kód pro Vanilla JS, React, Next.js, Three.js či react-three-fiber.

# Interaktivní 3D, stvořené pro web

Vložte své 3D scény jediným HTML tagem, nebo je exportujte jako kód pro **Vanilla JS, React, Next.js a Three.js**.

[Začněte tvořit](https://app.spline.design/signin)[Přečtěte si dokumentaci](https://docs.spline.design/exporting-your-scene/web/exporting-as-spline-viewer)

vas-web.cz

Spline Viewer

## Jeden tag, jakýkoli web

`<spline-viewer>` je nativní webová komponenta, takže funguje ve Frameru, Webflow, Squarespace, Reactu, Svelte i v čistém HTML. Vnímá celou stránku, nejen své plátno: scény můžou sledovat kurzor, dívat se na něj a animovat se při scrollování stránky.

[Zjistit víc o 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');

```

Export kódu

## Vaše 3D scéna jako kód

Exportujte ji jako Vanilla JS, React, Next.js, Three.js nebo react-three-fiber. Zkopírujte kód, otevřete ho v CodeSandboxu, nebo si stáhněte soubory a hostujte je sami.

[Zjistit víc o exportu kódu](https://docs.spline.design/exporting-your-scene/web/exporting-as-code)

Také na webu

## Od odkazu až po vlastní servery

### Code API

Spouštějte události, měňte proměnné a vlastnosti objektů z vlastního kódu ve Vanilla JS, Reactu a Next.js.

### Veřejné URL

Sdílejte scénu jako odkaz, nebo ji vložte do Notionu, Webflow, WordPressu a dalších.

### Vlastní hosting

Stáhněte si celý projekt včetně runtimu a provozujte ho na vlastních serverech. V plánu Enterprise.

### WebGPU

Scény se renderují přes WebGPU a tam, kde není k dispozici, automaticky přejdou na WebGL.

## Začněte tvořit ve 3D

Propojte svého agenta, pozvěte tým a publikujte svou první 3D scénu ještě dnes.

[Začněte tvořit](https://app.spline.design/signin)[Propojte svého agenta](https://spline.design/cs/mcp)

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

3D a 2D editor pro týmy a jejich agenty. Publikujte na web, iOS i Android.

#### Zeptejte se AI na Spline

#### Produkty

- [3D design](https://spline.design/cs/3d-design)
- [Hana](https://spline.design/cs/hana)
- [Omma](https://omma.build)
- [Generování 3D pomocí AI](https://spline.design/cs/ai-generate)
- [Spline MCP](https://spline.design/cs/mcp)
- [Spline Arena](https://spline.design/cs/arena)
- [Ceník](https://spline.design/cs/pricing)
- [Enterprise](https://spline.design/cs/enterprise)

#### Runtimy

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

#### Aplikace

- [Stáhnout](https://spline.design/cs/download)
- [Spline Mirror](https://spline.design/spline-mirror)
- [Stáhnout Spline Mirror](https://spline.design/download-mirror)

#### Výuka

- [Docs](https://docs.spline.design/)
- [Academy](https://spline.design/cs/academy)
- [Spline API](https://www.npmjs.com/package/@splinetool/runtime)
- [Řešení](https://spline.design/solutions)

#### Komunita

- [Komunita Spline](https://community.spline.design)
- [Blog](https://spline.design/cs/blog)
- [Novinky](https://spline.design/cs/changelog)
- [Vzdělávání](https://spline.design/cs/education)
- [Contra](https://spline.design/contra)
- [Partnerský program](https://spline.design/cs/affiliate)

#### Společnost

- [Zákazníci](https://spline.design/cs/customers)
- [Kariéra](https://www.ycombinator.com/companies/spline/jobs)
- [Zabezpečení](https://spline.design/cs/security)

#### Právní informace

- [Obchodní podmínky](https://spline.design/terms)
- [Ochrana soukromí](https://spline.design/privacy)

#### Kontakt

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

© 2026 - Spline, Inc.