diff --git a/src/pages/Home/Banner/index.module.scss b/src/pages/Home/Banner/index.module.scss
index 15cf5895b..710ad8997 100644
--- a/src/pages/Home/Banner/index.module.scss
+++ b/src/pages/Home/Banner/index.module.scss
@@ -145,6 +145,8 @@ $backgroundColor: #232323;
     gap: 8px;
   }
 
+  cursor: default;
+
   @media screen and (width <= 500px) {
     font-size: 30px;
   }
diff --git a/src/pages/Home/Banner/index.tsx b/src/pages/Home/Banner/index.tsx
index 22611a0bf..a4a50d482 100644
--- a/src/pages/Home/Banner/index.tsx
+++ b/src/pages/Home/Banner/index.tsx
@@ -1,4 +1,5 @@
 import { useQuery } from '@tanstack/react-query'
+import { InfoCircledIcon } from '@radix-ui/react-icons'
 import config from '../../../config'
 import styles from './index.module.scss'
 import { getKnowledgeSize } from './utils'
@@ -24,19 +25,21 @@ export default () => {
   )
   return (
     <div className={styles.root}>
-      <a
-        className={styles.knowledgeBase}
-        target="_blank"
-        rel="noopener noreferrer"
-        href="https://talk.nervos.org/t/how-to-get-the-average-occupied-bytes-per-live-cell-in-ckb/7138/2?u=keith"
-      >
+      <div className={styles.knowledgeBase}>
         <span>Knowledge Size</span>
         <br />
         <div className={styles.ticker}>
           <NumberTicker value={size ? +size : null} />
           <span>CKBytes</span>
+          <a
+            target="_blank"
+            rel="noopener noreferrer"
+            href="https://talk.nervos.org/t/how-to-get-the-average-occupied-bytes-per-live-cell-in-ckb/7138/2?u=keith"
+          >
+            <InfoCircledIcon color="white" />
+          </a>
         </div>
-      </a>
+      </div>
     </div>
   )
 }