diff --git a/src/components/Charts/DeviceCPULoad.tsx b/src/components/Charts/DeviceCPULoad.tsx
index 518bf92b..79cb64ce 100644
--- a/src/components/Charts/DeviceCPULoad.tsx
+++ b/src/components/Charts/DeviceCPULoad.tsx
@@ -67,7 +67,7 @@ const DeviceCPULoad: React.FC<DeviceCPULoadProps> = ({ load }) => {
         <Separator borderColor={'#e3e3e3'} />
         <XStack space={'$4'} style={{ padding: '10px 16px 10px 16px' }}>
           <IconText
-            icon={message === 'Good' ? '/icons/check-circle.png' : '/icons/alert.png'}
+            icon={message === 'Good' ? './icons/check-circle.png' : './icons/alert.png'}
             weight={'semibold'}
           >
             {message}
diff --git a/src/components/Charts/DeviceMemoryHealth.tsx b/src/components/Charts/DeviceMemoryHealth.tsx
index 444674c8..b7b2d2bc 100644
--- a/src/components/Charts/DeviceMemoryHealth.tsx
+++ b/src/components/Charts/DeviceMemoryHealth.tsx
@@ -70,7 +70,7 @@ const DeviceMemoryHealth = ({ currentMemory, maxMemory }: DeviceMemoryHealthProp
         </XStack>
         <Separator borderColor={'#e3e3e3'} />
         <XStack space={'$4'} style={{ padding: '10px 16px 10px 16px' }}>
-          <IconText icon={message === 'Good' ? '/icons/check-circle.png' : '/icons/alert.png'}>
+          <IconText icon={message === 'Good' ? './icons/check-circle.png' : './icons/alert.png'}>
             {message}
           </IconText>
           {message === 'Poor' && (
diff --git a/src/components/Charts/DeviceNetworkHealth.tsx b/src/components/Charts/DeviceNetworkHealth.tsx
index c74fc9c7..967002b9 100644
--- a/src/components/Charts/DeviceNetworkHealth.tsx
+++ b/src/components/Charts/DeviceNetworkHealth.tsx
@@ -75,7 +75,7 @@ const DeviceNetworkHealth = ({ uploadRate, downloadRate }: DeviceNetworkHealthPr
         </XStack>
         <Separator borderColor={'#e3e3e3'} />
         <XStack space={'$4'} style={{ padding: '10px 16px 10px 16px' }}>
-          <IconText icon={message === 'Good' ? '/icons/check-circle.png' : '/icons/alert.png'}>
+          <IconText icon={message === 'Good' ? './icons/check-circle.png' : './icons/alert.png'}>
             {message}
           </IconText>
           {message === 'Poor' && (
diff --git a/src/components/Charts/DeviceStorageHealth.tsx b/src/components/Charts/DeviceStorageHealth.tsx
index 6c6da6c5..356c22aa 100644
--- a/src/components/Charts/DeviceStorageHealth.tsx
+++ b/src/components/Charts/DeviceStorageHealth.tsx
@@ -69,7 +69,7 @@ const DeviceStorageHealth: React.FC<DeviceStorageHealthProps> = ({ storage, maxS
         <Separator borderColor={'#e3e3e3'} />
         <XStack space={'$4'} style={{ padding: '10px 16px 10px 16px' }}>
           <IconText
-            icon={message === 'Good' ? '/icons/check-circle.png' : '/icons/alert.png'}
+            icon={message === 'Good' ? './icons/check-circle.png' : './icons/alert.png'}
             weight={'semibold'}
           >
             {message}
diff --git a/src/components/General/Titles.tsx b/src/components/General/Titles.tsx
index fb24683a..4e5f790a 100644
--- a/src/components/General/Titles.tsx
+++ b/src/components/General/Titles.tsx
@@ -15,7 +15,7 @@ const Titles = ({ title, subtitle, isAdvancedSettings }: TitlesProps) => {
       <XStack style={{ justifyContent: 'space-between', alignItems: 'center' }}>
         <Title color={'#09101C'}>{title}</Title>
         {isAdvancedSettings && (
-          <Button size={32} variant="outline" icon={<Icon src={'/icons/reveal.png'} />}>
+          <Button size={32} variant="outline" icon={<Icon src={'./icons/reveal.png'} />}>
             Advanced Settings
           </Button>
         )}
diff --git a/src/components/Logos/NimbusLogo.tsx b/src/components/Logos/NimbusLogo.tsx
index 729c7c16..d074174c 100644
--- a/src/components/Logos/NimbusLogo.tsx
+++ b/src/components/Logos/NimbusLogo.tsx
@@ -11,8 +11,8 @@ const NimbusLogo = () => {
       }}
       space={'$3'}
     >
-      <img src={'/icons/marks.svg'} alt="marks" className="nimbus-logomark" />
-      <img src={'/icons/nimbus.svg'} alt="marks" />
+      <img src={'./icons/marks.svg'} alt="marks" className="nimbus-logomark" />
+      <img src={'./icons/nimbus.svg'} alt="marks" />
       <BetaTag />
     </XStack>
   )
diff --git a/src/components/Logos/NodesLogo.tsx b/src/components/Logos/NodesLogo.tsx
index 5647e56d..be18b2e1 100644
--- a/src/components/Logos/NodesLogo.tsx
+++ b/src/components/Logos/NodesLogo.tsx
@@ -12,7 +12,7 @@ const NodesLogo = () => {
       }}
       space={'$2'}
     >
-      <Icon src={'/icons/nodes-app-icon.png'} width={32} height={32} />
+      <Icon src={'./icons/nodes-app-icon.png'} width={32} height={32} />
       <Text size={27} weight={'semibold'}>
         nodes
       </Text>
diff --git a/src/constants.ts b/src/constants.ts
index 2467e6ef..592cd99d 100644
--- a/src/constants.ts
+++ b/src/constants.ts
@@ -1,5 +1,5 @@
-export const GREEN_CHECKMARK_ICON = '/icons/checkmark-circle-green.png'
-export const RED_CHECKMARK_ICON = '/icons/remove-circle-red.png'
+export const GREEN_CHECKMARK_ICON = './icons/checkmark-circle-green.png'
+export const RED_CHECKMARK_ICON = './icons/remove-circle-red.png'
 
 export const GOOD_STORAGE_TEXT =
   'You have plenty of storage available for additional node services.'