diff --git a/app/src/modules/builder/point/point.tsx b/app/src/modules/builder/point/point.tsx
index a2bddfc..1070305 100644
--- a/app/src/modules/builder/point/point.tsx
+++ b/app/src/modules/builder/point/point.tsx
@@ -6,7 +6,7 @@ import BoxMaterial from "../wrappers/materials/boxMaterial";
 import { usePointEventHandler } from "./eventHandler/usePointEventHandler";
 
 function Point({ point }: { readonly point: Point }) {
-    const boxScale: [number, number, number] = Constants.pointConfig.boxScale;
+    const boxScale: [number, number, number] = Constants.pointConfig.screenSpaceBoxScale;
     const colors = getColor(point);
 
     function getColor(point: Point) {
diff --git a/app/src/modules/builder/point/reference/referencePoint.tsx b/app/src/modules/builder/point/reference/referencePoint.tsx
index 2884a56..86d4f7f 100644
--- a/app/src/modules/builder/point/reference/referencePoint.tsx
+++ b/app/src/modules/builder/point/reference/referencePoint.tsx
@@ -1,10 +1,11 @@
 import * as THREE from "three";
+import { Box, ScreenSizer } from "@react-three/drei";
 import * as Constants from "../../../../types/world/worldConstants";
 
 import BoxMaterial from "../../wrappers/materials/boxMaterial";
 
 function ReferencePoint({ point }: { readonly point: Point }) {
-    const boxScale: [number, number, number] = Constants.pointConfig.boxScale;
+    const boxScale: [number, number, number] = Constants.pointConfig.screenSpaceBoxScale;
     const colors = {
         defaultInnerColor: Constants.pointConfig.defaultInnerColor,
         defaultOuterColor: Constants.pointConfig.helperColor,
@@ -29,10 +30,11 @@ function ReferencePoint({ point }: { readonly point: Point }) {
     if (!point) return null;
 
     return (
-        <mesh position={new THREE.Vector3(...point.position)} name={pointName} uuid={point.pointUuid} userData={point}>
-            <boxGeometry args={boxScale} />
-            <BoxMaterial variant="box1" uOuterColor={colors.defaultOuterColor} uInnerColor={colors.defaultInnerColor} />
-        </mesh>
+        <ScreenSizer scale={1} position={new THREE.Vector3(...point.position)} name={pointName} uuid={point.pointUuid} userData={point}>
+            <Box args={boxScale}>
+                <BoxMaterial variant="box1" uOuterColor={colors.defaultOuterColor} uInnerColor={colors.defaultInnerColor} />
+            </Box>
+        </ScreenSizer>
     );
 }
 
diff --git a/app/src/types/world/worldConstants.ts b/app/src/types/world/worldConstants.ts
index acc3cc6..b509ca2 100644
--- a/app/src/types/world/worldConstants.ts
+++ b/app/src/types/world/worldConstants.ts
@@ -114,6 +114,7 @@ export type PointConfig = {
     defaultInnerColor: string;
     defaultOuterColor: string;
     deleteColor: string;
+    screenSpaceBoxScale: [number, number, number];
     boxScale: [number, number, number];
     wallOuterColor: string;
     floorOuterColor: string;
@@ -316,7 +317,8 @@ export const pointConfig: PointConfig = {
     defaultInnerColor: "#ffffff", // Default inner color of the points
     defaultOuterColor: "#ffffff", // Default outer color of the points
     deleteColor: "#ff0000", // Color of the points when deleting
-    boxScale: [20, 20, 20], // Scale of the points
+    screenSpaceBoxScale: [20, 20, 20], // Scale of the points
+    boxScale: [0.5, 0.5, 0.5], // Scale of the points
     wallOuterColor: "#C7C7C7", // Outer color of the wall points
     floorOuterColor: "#808080", // Outer color of the floor points
     aisleOuterColor: "#FBBC05", // Outer color of the aisle points