Web Engine Docs
Preparing documentation
Documentation0%
Use the search bar to quickly find any topic
Content
Search
Examples
Ready
Web Engine v0.1.0-alpha
Edit this page on GitHub
Last updated: 1/16/2026
Was this page helpful?
Preparing documentation
Use the search bar to quickly find any topic
The 3D Viewport is your window into the game world, providing real-time visualization and interaction with your scene. It features Unity-style camera controls, transform gizmos, grid snapping, and multiple shading modes.
Orbit, pan, and zoom with mouse and keyboard for precise navigation
Translate, rotate, and scale objects with interactive gizmos
Align objects to grid for precise placement and organization
Wireframe, solid, and textured rendering for different workflows
The default camera mode lets you rotate around a focal point:
Hold Right Mouse Button to enter fly mode for free-form navigation:
Tip
Fly mode speed adapts to scene scale. Use Shift for quick traversal of large environments or Ctrl for fine precision.
Press F to frame selected objects in the viewport. The camera smoothly moves to focus on the selection while maintaining your current angle.
Press Shift + F to frame all objects in the scene, useful for getting an overview after loading a scene.
The default mode provides realistic depth perception with vanishing points. Best for general 3D editing and getting a sense of how the game will look.
Removes perspective distortion, showing true proportions and distances. Ideal for precise alignment, 2D work, and technical modeling.
Quickly snap to standard orthographic views using numpad shortcuts:
| View | Shortcut | Opposite View | |------|----------|---------------| | Front | Numpad 1 | Ctrl + Numpad 1 (Back) | | Right | Numpad 3 | Ctrl + Numpad 3 (Left) | | Top | Numpad 7 | Ctrl + Numpad 7 (Bottom) |
Tip
View presets automatically switch to orthographic mode for precise alignment work.
Click objects to select them without accidentally moving them. Useful for inspecting properties without modifying transforms.
Move objects along X (red), Y (green), or Z (blue) axes. Click and drag an axis arrow to constrain movement to that axis, or the center to move freely on the view plane.
Rotate objects around their pivot point. Three colored circles represent rotation around each axis.
Resize objects uniformly or along individual axes. Hold Shift while dragging for uniform scaling across all axes.
Press X to toggle between Local and World space:
The infinite grid helps visualize the ground plane and provides scale reference. Toggle with G or Viewport → Toggle Grid.
Enable snapping with Shift + S to align objects to grid increments:
Viewport → Settings → Snapping
- Grid Size: 0.25, 0.5, 1, 2, 5
- Angle: 5°, 10°, 15°, 45°, 90°
- Scale: 5%, 10%, 25%, 50%
Select objects and press Cmd/Ctrl + Shift + G to snap their position to the nearest grid point.
Display mesh edges only. Useful for checking topology, identifying overlapping geometry, and technical modeling work.
Flat shaded surfaces without textures. Shows basic lighting and form, good for modeling and performance on low-end hardware.
Full PBR rendering with materials, textures, and lighting. This is the default mode showing how the scene will appear in-game.
Component icons appear in the viewport to indicate entity types:
Toggle with I or Viewport → Toggle Icons.
Press Shift + G to hide all gizmos for an uncluttered view. Useful for screenshots or evaluating scene composition.
Press C to visualize physics colliders. Box, sphere, capsule, and mesh colliders are rendered as green wireframe overlays.
Hold Shift and drag to create a selection box. All objects within the box are selected.
Selected objects are highlighted with a colored outline (orange by default). Toggle with O if you need to see the object without the outline.
Access advanced viewport settings with Shift + , or the settings icon:
Press Shift + I to show performance statistics overlay:
The ViewCube in the top-right corner shows camera orientation. Click faces, edges, or corners to snap to that view direction.
Tip
Quick camera reset: Press Home to return camera to default position and orientation.
Tip
Isolate selection: Press Cmd/Ctrl + / to hide everything except selected objects. Great for focusing on specific areas.
Tip
Maximize viewport: Double-click the Scene tab or press Shift + Space to maximize the viewport for full-screen editing.
Warning
Performance tip: If the viewport is lagging, try: