Блог
Pascal Editor — open-source 3D-редактор зданий прямо в браузере В открытый доступ выложили полноценный 3D-редактор зданий на React Three Fiber и WebGPU. Без AutoCAD, без Revit, без лицензий за $5 000 в год.
База знаний
Pascal Editor — бесплатный 3D-редактор зданий прямо в браузере
Open-source 3D-редактор зданий на React Three Fiber и WebGPU. Работает в браузере без установки — стены, этажи, крыши, интерьеры. Бесплатная альтернатива AutoCAD и Revit для ранних этапов проектирования.
Pascal Editor — open-source 3D-редактор зданий, который целиком живёт в браузере. Никакой установки, никаких лицензий, никакой регистрации. Открыли вкладку — и моделируете стены, этажи, крыши, расставляете мебель.
Под капотом — WebGPU и React Three Fiber. То есть вся отрисовка идёт на видеокарте через браузер, на уровне, который раньше был доступен только десктопным приложениям вроде AutoCAD или Revit.
Не путайте: Pascal Editor — это инструмент для 3D-моделирования зданий, а не редактор кода на языке Pascal. Название легко вводит в заблуждение.
Так что конкретно умеет
| Возможность | Что это значит на практике |
| Стены и планировки | Рисуете стены, вставляете двери и окна. Проёмы реально вырезаются в геометрии (CSG-операции) — не просто текстурки поверх |
| Этажи и уровни | Многоэтажные здания с отдельной проработкой каждого уровня |
| Крыши и перекрытия | Моделирование крыш и плит перекрытия (slabs) |
| Зоны и комнаты | Разметка функциональных зон — спальни, кухни, гаражи, бассейн |
| Интерьер | Расстановка мебели и предметов внутри помещений |
| Генерация по описанию | Пишете «вилла с бассейном на два этажа» — и получаете стартовую модель, которую дорабатываете руками |
| Публикация | Готовые проекты можно выложить и поделиться ссылкой с кем угодно |
Что у него внутри
Архитектура — монорепо на Turborepo с тремя пакетами:
editor-v2/
├── apps/
│ └── editor/ # Next.js приложение
├── packages/
│ ├── core/ # Схемы, стейт-менеджмент, системы
│ └── viewer/ # 3D-рендеринг| Технология | Зачем |
| React 19 + Next.js 16 | Фреймворк приложения, SSR, роутинг |
| React Three Fiber | React-обёртка над Three.js — 3D становится обычным компонентным подходом |
| Three.js + WebGPU | Рендеринг на видеокарте через браузер. WebGPU — это следующее поколение после WebGL |
| Zustand | Стейт-менеджмент — лёгкий и предсказуемый |
| three-bvh-csg | Булевые операции с геометрией: вырезать проём в стене, объединить объёмы |
NPM-пакеты опубликованы отдельно: @pascal-app/core (схемы и стейт) и @pascal-app/viewer (3D-рендеринг). Можно подключать к своим проектам.
Как попробовать
Самый быстрый способ — просто открыть в браузере:
https://editor.pascal.appНикакой регистрации. Открыли — и работаете.
Если хотите запустить локально (для доработки или self-hosting):
git clone https://github.com/pascalorg/editor.git
cd editor
npm install
npm run devПро браузеры: WebGPU полноценно работает в Chrome. Firefox и Safari — поддержка в процессе. Если планируете встраивать Pascal Editor в продукт для широкой аудитории, нужно предусмотреть фоллбэк для старых браузеров.
Сколько стоит
Нисколько. Проект полностью open-source под лицензией MIT.
| Параметр | Значение |
| Стоимость | Бесплатно, MIT-лицензия |
| Регистрация | Не нужна |
| Лимиты | Ограничены только мощностью вашего устройства и браузера |
| Self-hosting | Полностью поддерживается |
Контекст цен: AutoCAD — от $1 975/год, Revit — от $3 645/год. Pascal Editor — $0. Понятно, что это не замена на уровне рабочей документации, но для ранних этапов проектирования и визуализации — более чем достаточно.
Где это реально пригодится
Быстрый прототип для клиента. Набросали планировку, расставили зоны — и показали интерактивную 3D-модель прямо в браузере. Без пересылки тяжёлых файлов, без «скачайте наш просмотрщик».
Конфигуратор на сайт застройщика. Форкнуть репо, адаптировать под свои нужды, встроить в React-приложение. React Three Fiber делает такую интеграцию естественной — это обычные React-компоненты.
Разобраться в WebGPU и React Three Fiber. Если вы разработчик и хотите понять, как устроен современный 3D в вебе — Pascal Editor отличная учебная кодовая база. Чистая архитектура, разделение ответственности, современный стек.
3D-планы для умного дома. Энтузиасты Home Assistant используют Pascal Editor для создания планов помещений, которые потом интегрируют с системами автоматизации.
Пара нюансов, прежде чем бросаться пробовать
- WebGPU пока молодая. Полная поддержка — только Chrome. Для продакшен-проектов с широкой аудиторией это критичный момент
- Проект на ранней стадии. Это не AutoCAD-killer для рабочей документации. Это инструмент для ранних этапов — визуализация, прототипирование, эксперименты
- Производительность зависит от GPU. На слабых встроенных видеокартах сложные сцены могут подтормаживать
Ссылки
- Онлайн-редактор: editor.pascal.app
- Лендинг: pascaleditor.app
- GitHub: github.com/pascalorg/editor
- Документация: mintlify.com/pascalorg/editor
- Discord: discord.gg/SaBRA9t2
- NPM: @pascal-app/core, @pascal-app/viewer