⚡ AI Three StudioPhase 19.4 · Live Page Edit · Self-Updating

FPS: --Objects: 0Move
Editor · on-demand render
Shift+dragBox GGroup W/E/RTools FFocus HomeReset Ctrl+?Guide
index.html
styles.css
Syntax Error
⌨ Guide & Shortcuts✕

📘 Quick Start

  1. Demo loads a sample project, or Ctrl+O to import your own HTML/JS (even vibe-coded pages).
  2. Main viewport: LMB-drag orbit · RMB pan · wheel zoom. Click objects to select.
  3. W/E/R = Move/Rotate/Scale. Drag gizmo handles. Everything auto-syncs to code.
  4. Bottom panel: edit code (Monaco), Ctrl+Enter re-runs.

🎮 Edit tab — editing a LIVE page (Blender-style)

  1. 🌐 Page mode edits your real running website inside the iframe. Click any named mesh → gizmo → drag. Changes are written back into your source code automatically.
  2. Page has animations (spinners, scroll effects)? Hit ⏸ Freeze: all animation frames pause mid-flight so objects hold still while you pose them. Click again to resume.
  3. Works with ES-module pages (import * as THREE from 'three') AND legacy global-script pages.
  4. Objects do not need .name. Live Page Edit assigns stable runtime IDs and uses source bindings when they can be verified.
  5. 🎬 Scene mode = native second viewport of the studio scene — always works, even offline previews.

🎯 Multi-select & Group

  1. Shift+click, box-select (Shift+drag), Ctrl+A.
  2. G = Group Mode: rotate/scale around selection-center pivot. Esc exits.

Tools

Move/Rotate/ScaleW/E/R
Group modeG

Selection

SelectClick
ToggleShift+Click
AllCtrl+A
DeselectEsc
FocusF

Edit

Undo/RedoCtrl+Z / Y
Copy/Paste/Dup/DelC/V/D/Del

Add

RandomShift+A
Cube…Capsule1…6

File

Save/Open/ExportS/O/Shift+E
RunCtrl+Enter

View

Views7/8/9/Home
Expand previewCtrl+P
Version panel⇪ Ver
📂 Import Project✕
📦 Export Project✕
VALIDATION
MODE
📄 Original CodeAs written
🔧 RegeneratedFrom scene objects
Single HTMLSelf-contained
ZIPindex.html + styles.css
⇪ three.js Version & Auto-Updates✕
Current pinned: …
Everything (generated projects, exports, previews) switches instantly. The studio core applies it after reload:
Why this exists: one pinned constant drives ALL three.js URLs (import maps, addons, exports). Change it here — no code edits, no waiting for app updates.