diff --git a/apps/engine-test/src_bundle/bundle.threejs.js b/apps/engine-test/src_bundle/bundle.threejs.js
index 4c987378..13bd2d26 100644
--- a/apps/engine-test/src_bundle/bundle.threejs.js
+++ b/apps/engine-test/src_bundle/bundle.threejs.js
@@ -7,7 +7,8 @@ export { Color } from 'three/src/math/Color.js';
 export { AmbientLight } from 'three/src/lights/AmbientLight.js';
 export { HemisphereLight } from 'three/src/lights/HemisphereLight.js';
 export { DirectionalLight } from 'three/src/lights/DirectionalLight.js';
-// export { PlaneGeometry } from 'three/src/geometries/PlaneGeometry';
+// export { PlaneGeometry } from 'three/src/geometries/PlaneGeometry.js';
+export { BoxGeometry } from 'three/src/geometries/BoxGeometry.js';
 export { EdgesGeometry } from 'three/src/geometries/EdgesGeometry.js';
 export { MeshPhongMaterial } from 'three/src/materials/MeshPhongMaterial.js';
 export { LineBasicMaterial } from 'three/src/materials/LineBasicMaterial.js';
@@ -25,6 +26,7 @@ export { Group } from 'three/src/objects/Group.js';
 export { Line } from 'three/src/objects/Line.js';
 export { Matrix4 } from 'three/src/math/Matrix4.js';
 export { Vector3 } from 'three/src/math/Vector3.js';
+export { Box3 } from 'three/src/math/Box3.js';
 // export { Euler } from 'three/src/math/Euler.js';
 // export { Texture } from 'three/src/textures/Texture.js';
 // export * from 'three/src/constants.js';
diff --git a/apps/jscad-web/src/viewState.js b/apps/jscad-web/src/viewState.js
index 860ef739..fd60069f 100644
--- a/apps/jscad-web/src/viewState.js
+++ b/apps/jscad-web/src/viewState.js
@@ -147,9 +147,9 @@ export class ViewState {
   updateScene() {
     const { axes, grid, model } = this
     const items = []
-    if (axes) items.push({ id: 'axes', items: axes })
-    if (grid) items.push({ id: 'grid', items: grid })
-    if (model) items.push({ id: 'model', items: model })
+    if (axes) items.push({ id: 'axes', items: axes, ignoreBB:true })
+    if (grid) items.push({ id: 'grid', items: grid, ignoreBB:true })
+    if (model) items.push({ id: 'model', items: model, ignoreBB:false })
 
     this.viewer?.setScene({ items }, { smooth: this.smoothRender })
   }
diff --git a/apps/jscad-web/src_bundle/bundle.threejs.js b/apps/jscad-web/src_bundle/bundle.threejs.js
index 4c987378..280ab5ed 100644
--- a/apps/jscad-web/src_bundle/bundle.threejs.js
+++ b/apps/jscad-web/src_bundle/bundle.threejs.js
@@ -8,6 +8,7 @@ export { AmbientLight } from 'three/src/lights/AmbientLight.js';
 export { HemisphereLight } from 'three/src/lights/HemisphereLight.js';
 export { DirectionalLight } from 'three/src/lights/DirectionalLight.js';
 // export { PlaneGeometry } from 'three/src/geometries/PlaneGeometry';
+export { BoxGeometry } from 'three/src/geometries/BoxGeometry.js';
 export { EdgesGeometry } from 'three/src/geometries/EdgesGeometry.js';
 export { MeshPhongMaterial } from 'three/src/materials/MeshPhongMaterial.js';
 export { LineBasicMaterial } from 'three/src/materials/LineBasicMaterial.js';
@@ -25,6 +26,7 @@ export { Group } from 'three/src/objects/Group.js';
 export { Line } from 'three/src/objects/Line.js';
 export { Matrix4 } from 'three/src/math/Matrix4.js';
 export { Vector3 } from 'three/src/math/Vector3.js';
+export { Box3 } from 'three/src/math/Box3.js';
 // export { Euler } from 'three/src/math/Euler.js';
 // export { Texture } from 'three/src/textures/Texture.js';
 // export * from 'three/src/constants.js';
diff --git a/packages/render-threejs/index.js b/packages/render-threejs/index.js
index 06553e90..d4af7ab1 100644
--- a/packages/render-threejs/index.js
+++ b/packages/render-threejs/index.js
@@ -8,6 +8,8 @@ export function RenderThreejs({
   DirectionalLight,
   Scene,
   Group,
+  Box3,
+  BoxGeometry,
   Vector3,
   Color, // used by both
   // used by CommonToThree
@@ -199,6 +201,7 @@ export function RenderThreejs({
   }
 
   function setScene(scene,{smooth}={}) {
+    console.log('setScene', scene)
     groups.forEach(group => {
       _scene.remove(group)
     })
@@ -208,19 +211,39 @@ export function RenderThreejs({
     setTimeout(()=>{
       old.forEach(ent => ent.geometry?.dispose?.())
     },0)
+
     scene.items.forEach(item => {
       const group = new Group()
+      group.jscadId = item.id
+      group.ignoreBB = item.ignoreBB
       groups.push(group)
+      let box = new Box3()
       item.items.forEach(obj => {
         const obj3d = csgConvert(obj, { smooth, scene, meshColor})
         if (obj3d) {
           entities.push(obj3d)
+          console.log('obj3d', obj3d)
+          if(!group.ignoreBB) box.expandByObject(obj3d)
           group.add(obj3d)
         } else {
           console.error('could not convert to obj3d', obj)
         }
       })
       _scene.add(group)
+      console.log('box', box)
+      let {x,y,z} = box.max
+      let min = box.min
+      let wx = x-min.x, wy=y-min.y,wz=z-min.z
+      let boxGeom = new BoxGeometry(wx,wy,wz)
+      // boxGeom.position.x = min.x + wx/2
+      // boxGeom.position.y = min.y + wy/2
+      // boxGeom.position.z = min.z + wz/2
+      console.log('BoxGeometry(wx,wy,wz)', wx,wy,wz)
+      let mesh = new Mesh(boxGeom, new MeshPhongMaterial({color:'90909090',opacity:0.5, transparent:true}))
+      mesh.position.x = min.x + wx/2
+      mesh.position.y = min.y + wy/2
+      mesh.position.z = min.z + wz/2
+      groups[0].add(mesh)
     })
     updateView()
   }