diff --git a/public/assets/hotspot.glb b/public/assets/hotspot.glb
index 647e88b..2ba3412 100644
Binary files a/public/assets/hotspot.glb and b/public/assets/hotspot.glb differ
diff --git a/src/components/hotspot/hotspot.tsx b/src/components/hotspot/hotspot.tsx
index bef57e0..7230eb9 100644
--- a/src/components/hotspot/hotspot.tsx
+++ b/src/components/hotspot/hotspot.tsx
@@ -171,25 +171,26 @@ export default function Hotspot({
             <group scale-x={flipped ? -1 : 1}>
               <group position={[0.67, 0, 0]}>
                 <mesh geometry={nodes.Hotspot_Surround_01.geometry}>
-                  <meshBasicMaterial color="#35373e" />
+                  <meshBasicMaterial color="#babcbe" />
                 </mesh>
                 <mesh
                   position-x={width + padding}
                   geometry={nodes.Hotspot_Surround_03001.geometry}
                 >
-                  <meshBasicMaterial color="#35373e" />
+                  <meshBasicMaterial color="#babcbe" />
                 </mesh>
               </group>
               <group position={labelPosition}>
                 <mesh>
                   <boxBufferGeometry args={[width + padding, 0.395, 0.057]} />
-                  <meshBasicMaterial color="#35373e" />
+                  <meshBasicMaterial color="#babcbe" />
                 </mesh>
                 <Text
                   scale-x={flipped ? -1 : 1}
                   position-x={0.025}
                   position-z={0.057 + 0.0001}
                   fontSize={0.395 / 2}
+                  color="#000000"
                   onAfterRender={(renderer, scene, camera, geometry) => {
                     const nextWidth = Math.abs(geometry.boundingBox.max.x * 2);
                     if (nextWidth === Infinity) return;
diff --git a/src/components/model-hotspot/model-hotspot.tsx b/src/components/model-hotspot/model-hotspot.tsx
index a718f84..1f86977 100644
--- a/src/components/model-hotspot/model-hotspot.tsx
+++ b/src/components/model-hotspot/model-hotspot.tsx
@@ -125,25 +125,26 @@ export default function ModelHotspot({
             <group scale-x={flipped ? -1 : 1}>
               <group position={[0.67, 0, 0]}>
                 <mesh geometry={nodes.Hotspot_Surround_01.geometry}>
-                  <meshBasicMaterial color="#35373e" />
+                  <meshBasicMaterial color="#babcbe" />
                 </mesh>
                 <mesh
                   position-x={width + padding}
                   geometry={nodes.Hotspot_Surround_03001.geometry}
                 >
-                  <meshBasicMaterial color="#35373e" />
+                  <meshBasicMaterial color="#babcbe" />
                 </mesh>
               </group>
               <group position={labelPosition}>
                 <mesh>
                   <boxBufferGeometry args={[width + padding, 0.395, 0.057]} />
-                  <meshBasicMaterial color="#35373e" />
+                  <meshBasicMaterial color="#babcbe" />
                 </mesh>
                 <Text
                   scale-x={flipped ? -1 : 1}
                   position-x={0.025}
                   position-z={0.057 + 0.0001}
                   fontSize={0.395 / 2}
+                  color="#000000"
                   onAfterRender={(renderer, scene, camera, geometry) => {
                     const nextWidth = Math.abs(geometry.boundingBox.max.x * 2);
                     if (nextWidth === Infinity) return;