# Spline для веба: встраивание и экспорт интерактивного 3D (https://spline.design/ru/web)

> Встраивайте интерактивное 3D с помощью веб-компонента Spline Viewer или экспортируйте сцены в код на Vanilla JS, React, Next.js, Three.js или react-three-fiber.

# Интерактивное 3D, созданное для веба

Встраивайте 3D-сцены одним HTML-тегом или экспортируйте их в код для **Vanilla JS, React, Next.js и Three.js**.

[Начать](https://app.spline.design/signin)[Документация](https://docs.spline.design/exporting-your-scene/web/exporting-as-spline-viewer)

vash-sait.ru

Spline Viewer

## Один тег — любой сайт

`<spline-viewer>` — нативный веб-компонент, поэтому он работает во Framer, Webflow, Squarespace, React, Svelte и на чистом HTML. Он реагирует на всю страницу, а не только на свой холст: сцены могут следовать за курсором, смотреть на него и анимироваться при прокрутке.

[Подробнее про 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');

```

Экспорт в код

## Ваша 3D-сцена в виде кода

Экспортируйте в Vanilla JS, React, Next.js, Three.js или react-three-fiber. Скопируйте код, откройте его в CodeSandbox или скачайте файлы и разместите у себя.

[Подробнее про экспорт в код](https://docs.spline.design/exporting-your-scene/web/exporting-as-code)

Ещё для веба

## От ссылки до собственных серверов

### API для кода

Запускайте события, обновляйте переменные и меняйте свойства объектов из своего кода на Vanilla JS, React и Next.js.

### Публичные ссылки

Делитесь сценой по ссылке или встраивайте её в Notion, Webflow, WordPress и другие сервисы.

### Собственный хостинг

Скачайте проект целиком, вместе с рантаймом, и раздавайте его со своих серверов. В тарифе Enterprise.

### WebGPU

Сцены рендерятся на WebGPU и автоматически переключаются на WebGL там, где он недоступен.

## Начните создавать в 3D

Подключите агента, пригласите команду и опубликуйте свою первую 3D-сцену уже сегодня.

[Начать](https://app.spline.design/signin)[Подключить агента](https://spline.design/ru/mcp)

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

3D- и 2D-редактор для команд и их агентов. Публикуйте в веб, на iOS и Android.

#### Спросите ИИ о Spline

#### Продукты

- [3D-дизайн](https://spline.design/ru/3d-design)
- [Hana](https://spline.design/ru/hana)
- [Omma](https://omma.build)
- [Генерация 3D с ИИ](https://spline.design/ru/ai-generate)
- [Spline MCP](https://spline.design/ru/mcp)
- [Spline Arena](https://spline.design/ru/arena)
- [Цены](https://spline.design/ru/pricing)
- [Enterprise](https://spline.design/ru/enterprise)

#### Рантаймы

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

#### Приложения

- [Скачать](https://spline.design/ru/download)
- [Spline Mirror](https://spline.design/spline-mirror)
- [Скачать Spline Mirror](https://spline.design/download-mirror)

#### Обучение

- [Docs](https://docs.spline.design/)
- [Academy](https://spline.design/ru/academy)
- [Spline API](https://www.npmjs.com/package/@splinetool/runtime)
- [Решения](https://spline.design/solutions)

#### Сообщество

- [Сообщество Spline](https://community.spline.design)
- [Blog](https://spline.design/ru/blog)
- [Что нового](https://spline.design/ru/changelog)
- [Образование](https://spline.design/ru/education)
- [Contra](https://spline.design/contra)
- [Партнёрам](https://spline.design/ru/affiliate)

#### Компания

- [Клиенты](https://spline.design/ru/customers)
- [Вакансии](https://www.ycombinator.com/companies/spline/jobs)
- [Безопасность](https://spline.design/ru/security)

#### Правовая информация

- [Условия использования](https://spline.design/terms)
- [Конфиденциальность](https://spline.design/privacy)

#### Контакты

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

© 2026 - Spline, Inc.