diff --git a/components/tools/ToolDashboard.js b/components/tools/ToolDashboard.js
index 5d93d55b188b..a6cc70551492 100644
--- a/components/tools/ToolDashboard.js
+++ b/components/tools/ToolDashboard.js
@@ -61,6 +61,22 @@ export default function ToolDashboard() {
     };
   });
 
+  // Navigates the user to the specific categories on providing the URL
+  useEffect(() => {
+    if (!loading) {
+        const urlPath = router.asPath;
+        const elementIndex = urlPath.lastIndexOf('#');
+        if (elementIndex !== -1) {
+          const element = urlPath.substring(elementIndex + 1).replace(/%20/g, ' ');
+            const DOMElement = document.getElementById(element);
+            if (DOMElement) {
+              DOMElement.scrollIntoView({ behavior: 'smooth', block: 'start', inline: 'nearest' });
+            }            
+        }
+    }
+  }, [loading]);
+
+
   // Function to update the list of tools according to the current filters applied
   const updateToolsList = () => {
     let tempToolsList = {};
diff --git a/components/tools/ToolsList.js b/components/tools/ToolsList.js
index 048c7acc2c32..c2ee79d7b12a 100644
--- a/components/tools/ToolsList.js
+++ b/components/tools/ToolsList.js
@@ -6,7 +6,7 @@ export default function toolsList({ toolsData }) {
     <div className="" data-testid="ToolsList-main" >
       {Object.keys(toolsData).map((categoryName, index) => {
         if(toolsData[categoryName].toolsList.length > 0) return (
-        <div className='my-8' key={index} id={categoryName}>
+        <div className='my-8 scroll-m-96 scroll-mb-96' key={index} id={categoryName}>
           <Heading typeStyle='heading-md-semibold' className='my-2' >
             {categoryName}
           </Heading>