diff --git a/lib/networks/getNetworkUtilizationParams.ts b/lib/networks/getNetworkUtilizationParams.ts
new file mode 100644
index 0000000000..8168629a02
--- /dev/null
+++ b/lib/networks/getNetworkUtilizationParams.ts
@@ -0,0 +1,25 @@
+export default function getNetworkUtilizationParams(value: number) {
+  const load = (() => {
+    if (value > 80) {
+      return 'high';
+    }
+
+    if (value > 50) {
+      return 'medium';
+    }
+
+    return 'low';
+  })();
+
+  const colors = {
+    high: 'red.600',
+    medium: 'orange.600',
+    low: 'green.600',
+  };
+  const color = colors[load];
+
+  return {
+    load,
+    color,
+  };
+}
diff --git a/ui/blocks/BlocksTabSlot.tsx b/ui/blocks/BlocksTabSlot.tsx
index 15e153093a..5d555cc3b3 100644
--- a/ui/blocks/BlocksTabSlot.tsx
+++ b/ui/blocks/BlocksTabSlot.tsx
@@ -1,4 +1,5 @@
 import { Flex, Box, Text } from '@chakra-ui/react';
+import { upperFirst } from 'es-toolkit';
 import React from 'react';
 
 import type { PaginationParams } from 'ui/shared/pagination/types';
@@ -6,9 +7,11 @@ import type { PaginationParams } from 'ui/shared/pagination/types';
 import { route } from 'nextjs-routes';
 
 import useApiQuery from 'lib/api/useApiQuery';
+import getNetworkUtilizationParams from 'lib/networks/getNetworkUtilizationParams';
 import { HOMEPAGE_STATS } from 'stubs/stats';
 import { Link } from 'toolkit/chakra/link';
 import { Skeleton } from 'toolkit/chakra/skeleton';
+import { Tooltip } from 'toolkit/chakra/tooltip';
 import { nbsp } from 'toolkit/utils/htmlEntities';
 import IconSvg from 'ui/shared/IconSvg';
 import Pagination from 'ui/shared/pagination/Pagination';
@@ -24,6 +27,8 @@ const BlocksTabSlot = ({ pagination }: Props) => {
     },
   });
 
+  const networkUtilization = getNetworkUtilizationParams(statsQuery.data?.network_utilization_percentage ?? 0);
+
   return (
     <Flex alignItems="center" columnGap={ 8 } display={{ base: 'none', lg: 'flex' }}>
       { statsQuery.data?.network_utilization_percentage !== undefined && (
@@ -31,9 +36,11 @@ const BlocksTabSlot = ({ pagination }: Props) => {
           <Text as="span" fontSize="sm">
             Network utilization (last 50 blocks):{ nbsp }
           </Text>
-          <Skeleton display="inline-block" fontSize="sm" color="blue.500" fontWeight={ 600 } loading={ statsQuery.isPlaceholderData }>
-            <span>{ statsQuery.data.network_utilization_percentage.toFixed(2) }%</span>
-          </Skeleton>
+          <Tooltip content={ `${ upperFirst(networkUtilization.load) } load` }>
+            <Skeleton display="inline-block" fontSize="sm" color={ networkUtilization.color } fontWeight={ 600 } loading={ statsQuery.isPlaceholderData }>
+              <span>{ statsQuery.data.network_utilization_percentage.toFixed(2) }%</span>
+            </Skeleton>
+          </Tooltip>
         </Box>
       ) }
       <Link href={ route({ pathname: '/block/countdown' }) }>
diff --git a/ui/gasTracker/GasTrackerNetworkUtilization.tsx b/ui/gasTracker/GasTrackerNetworkUtilization.tsx
index 937faafe3c..a077019c71 100644
--- a/ui/gasTracker/GasTrackerNetworkUtilization.tsx
+++ b/ui/gasTracker/GasTrackerNetworkUtilization.tsx
@@ -1,6 +1,7 @@
 import { chakra } from '@chakra-ui/react';
 import React from 'react';
 
+import getNetworkUtilizationParams from 'lib/networks/getNetworkUtilizationParams';
 import { Skeleton } from 'toolkit/chakra/skeleton';
 import { mdash } from 'toolkit/utils/htmlEntities';
 
@@ -10,24 +11,7 @@ interface Props {
 }
 
 const GasTrackerNetworkUtilization = ({ percentage, isLoading }: Props) => {
-  const load = (() => {
-    if (percentage > 80) {
-      return 'high';
-    }
-
-    if (percentage > 50) {
-      return 'medium';
-    }
-
-    return 'low';
-  })();
-
-  const colors = {
-    high: 'red.600',
-    medium: 'orange.600',
-    low: 'green.600',
-  };
-  const color = colors[load];
+  const { load, color } = getNetworkUtilizationParams(percentage);
 
   return (
     <Skeleton loading={ isLoading } whiteSpace="pre-wrap">
diff --git a/ui/home/LatestBlocks.tsx b/ui/home/LatestBlocks.tsx
index e544278069..25145d3c0c 100644
--- a/ui/home/LatestBlocks.tsx
+++ b/ui/home/LatestBlocks.tsx
@@ -1,5 +1,6 @@
 import { chakra, Box, Flex, Text, VStack } from '@chakra-ui/react';
 import { useQueryClient } from '@tanstack/react-query';
+import { upperFirst } from 'es-toolkit';
 import React from 'react';
 
 import type { SocketMessage } from 'lib/socket/types';
@@ -11,6 +12,7 @@ import config from 'configs/app';
 import useApiQuery, { getResourceKey } from 'lib/api/useApiQuery';
 import useInitialList from 'lib/hooks/useInitialList';
 import useIsMobile from 'lib/hooks/useIsMobile';
+import getNetworkUtilizationParams from 'lib/networks/getNetworkUtilizationParams';
 import useSocketChannel from 'lib/socket/useSocketChannel';
 import useSocketMessage from 'lib/socket/useSocketMessage';
 import { BLOCK } from 'stubs/block';
@@ -18,6 +20,7 @@ import { HOMEPAGE_STATS } from 'stubs/stats';
 import { Heading } from 'toolkit/chakra/heading';
 import { Link } from 'toolkit/chakra/link';
 import { Skeleton } from 'toolkit/chakra/skeleton';
+import { Tooltip } from 'toolkit/chakra/tooltip';
 import { nbsp } from 'toolkit/utils/htmlEntities';
 
 import LatestBlocksItem from './LatestBlocksItem';
@@ -101,6 +104,8 @@ const LatestBlocks = () => {
     );
   }
 
+  const networkUtilization = getNetworkUtilizationParams(statsQueryResult.data?.network_utilization_percentage ?? 0);
+
   return (
     <Box width={{ base: '100%', lg: '280px' }} flexShrink={ 0 }>
       <Heading level="3">Latest blocks</Heading>
@@ -109,9 +114,11 @@ const LatestBlocks = () => {
           <Text as="span">
             Network utilization:{ nbsp }
           </Text>
-          <Text as="span" color="blue.500" fontWeight={ 700 }>
-            { statsQueryResult.data?.network_utilization_percentage.toFixed(2) }%
-          </Text>
+          <Tooltip content={ `${ upperFirst(networkUtilization.load) } load` }>
+            <Text as="span" color={ networkUtilization.color } fontWeight={ 700 }>
+              { statsQueryResult.data?.network_utilization_percentage.toFixed(2) }%
+            </Text>
+          </Tooltip>
         </Skeleton>
       ) }
       { statsQueryResult.data?.celo && (
diff --git a/ui/home/__screenshots__/LatestBlocks.pw.tsx_dark-color-mode_default-view-mobile-dark-mode-1.png b/ui/home/__screenshots__/LatestBlocks.pw.tsx_dark-color-mode_default-view-mobile-dark-mode-1.png
index 2dcd5bcf26..17efffa979 100644
Binary files a/ui/home/__screenshots__/LatestBlocks.pw.tsx_dark-color-mode_default-view-mobile-dark-mode-1.png and b/ui/home/__screenshots__/LatestBlocks.pw.tsx_dark-color-mode_default-view-mobile-dark-mode-1.png differ
diff --git a/ui/home/__screenshots__/LatestBlocks.pw.tsx_default_L2-view-1.png b/ui/home/__screenshots__/LatestBlocks.pw.tsx_default_L2-view-1.png
index ff5e07ee68..9b832f02e1 100644
Binary files a/ui/home/__screenshots__/LatestBlocks.pw.tsx_default_L2-view-1.png and b/ui/home/__screenshots__/LatestBlocks.pw.tsx_default_L2-view-1.png differ
diff --git a/ui/home/__screenshots__/LatestBlocks.pw.tsx_default_default-view-mobile-dark-mode-1.png b/ui/home/__screenshots__/LatestBlocks.pw.tsx_default_default-view-mobile-dark-mode-1.png
index ad3dd707d1..864aba1492 100644
Binary files a/ui/home/__screenshots__/LatestBlocks.pw.tsx_default_default-view-mobile-dark-mode-1.png and b/ui/home/__screenshots__/LatestBlocks.pw.tsx_default_default-view-mobile-dark-mode-1.png differ
diff --git a/ui/home/__screenshots__/LatestBlocks.pw.tsx_default_no-reward-view-1.png b/ui/home/__screenshots__/LatestBlocks.pw.tsx_default_no-reward-view-1.png
index 201dd6f06d..f942719818 100644
Binary files a/ui/home/__screenshots__/LatestBlocks.pw.tsx_default_no-reward-view-1.png and b/ui/home/__screenshots__/LatestBlocks.pw.tsx_default_no-reward-view-1.png differ
diff --git a/ui/home/__screenshots__/LatestBlocks.pw.tsx_default_socket-new-item-1.png b/ui/home/__screenshots__/LatestBlocks.pw.tsx_default_socket-new-item-1.png
index 757397071a..25de41c1eb 100644
Binary files a/ui/home/__screenshots__/LatestBlocks.pw.tsx_default_socket-new-item-1.png and b/ui/home/__screenshots__/LatestBlocks.pw.tsx_default_socket-new-item-1.png differ
diff --git a/ui/home/__screenshots__/LatestBlocks.pw.tsx_default_with-long-block-height-1.png b/ui/home/__screenshots__/LatestBlocks.pw.tsx_default_with-long-block-height-1.png
index 7dc2379c60..96c8b3af7e 100644
Binary files a/ui/home/__screenshots__/LatestBlocks.pw.tsx_default_with-long-block-height-1.png and b/ui/home/__screenshots__/LatestBlocks.pw.tsx_default_with-long-block-height-1.png differ
diff --git a/ui/home/__screenshots__/LatestBlocks.pw.tsx_mobile_default-view-mobile-dark-mode-1.png b/ui/home/__screenshots__/LatestBlocks.pw.tsx_mobile_default-view-mobile-dark-mode-1.png
index a16f594308..c193cb96ad 100644
Binary files a/ui/home/__screenshots__/LatestBlocks.pw.tsx_mobile_default-view-mobile-dark-mode-1.png and b/ui/home/__screenshots__/LatestBlocks.pw.tsx_mobile_default-view-mobile-dark-mode-1.png differ
diff --git a/ui/pages/__screenshots__/Blocks.pw.tsx_dark-color-mode_base-view-dark-mode-1.png b/ui/pages/__screenshots__/Blocks.pw.tsx_dark-color-mode_base-view-dark-mode-1.png
index 139c621f57..a83ff90bff 100644
Binary files a/ui/pages/__screenshots__/Blocks.pw.tsx_dark-color-mode_base-view-dark-mode-1.png and b/ui/pages/__screenshots__/Blocks.pw.tsx_dark-color-mode_base-view-dark-mode-1.png differ
diff --git a/ui/pages/__screenshots__/Blocks.pw.tsx_default_base-view-dark-mode-1.png b/ui/pages/__screenshots__/Blocks.pw.tsx_default_base-view-dark-mode-1.png
index dc3a0ee1f8..f8c1f0cb48 100644
Binary files a/ui/pages/__screenshots__/Blocks.pw.tsx_default_base-view-dark-mode-1.png and b/ui/pages/__screenshots__/Blocks.pw.tsx_default_base-view-dark-mode-1.png differ
diff --git a/ui/pages/__screenshots__/Blocks.pw.tsx_default_hidden-fields-1.png b/ui/pages/__screenshots__/Blocks.pw.tsx_default_hidden-fields-1.png
index d4f2634c07..4d1db35402 100644
Binary files a/ui/pages/__screenshots__/Blocks.pw.tsx_default_hidden-fields-1.png and b/ui/pages/__screenshots__/Blocks.pw.tsx_default_hidden-fields-1.png differ
diff --git a/ui/pages/__screenshots__/Home.pw.tsx_default_default-view-screen-xl-base-view-1.png b/ui/pages/__screenshots__/Home.pw.tsx_default_default-view-screen-xl-base-view-1.png
index b8d2775265..13560dddd5 100644
Binary files a/ui/pages/__screenshots__/Home.pw.tsx_default_default-view-screen-xl-base-view-1.png and b/ui/pages/__screenshots__/Home.pw.tsx_default_default-view-screen-xl-base-view-1.png differ
diff --git a/ui/pages/__screenshots__/Home.pw.tsx_default_mobile-base-view-1.png b/ui/pages/__screenshots__/Home.pw.tsx_default_mobile-base-view-1.png
index 2b2f7d1d07..a5321c0778 100644
Binary files a/ui/pages/__screenshots__/Home.pw.tsx_default_mobile-base-view-1.png and b/ui/pages/__screenshots__/Home.pw.tsx_default_mobile-base-view-1.png differ