diff --git a/personal-portfolio/src/components/Banner.js b/personal-portfolio/src/components/Banner.js
index a813a6b3d..7c18e4cb2 100644
--- a/personal-portfolio/src/components/Banner.js
+++ b/personal-portfolio/src/components/Banner.js
@@ -46,7 +46,14 @@ export const Banner = () => {
       setIndex(prevIndex => prevIndex + 1);
     }
   }
-
+  
+  const scrollToContacts = () => {
+        const contactsElement = document.getElementById('connect');
+        if (contactsElement) {
+          contactsElement.scrollIntoView({ behavior: 'smooth' });
+        }
+      };
+  
   return (
     <section className="banner" id="home">
       <Container>
@@ -58,7 +65,7 @@ export const Banner = () => {
                 <span className="tagline">Welcome to my Portfolio</span>
                 <h1>{`Hi! I'm Judy`} <span className="txt-rotate" dataPeriod="1000" data-rotate='[ "Web Developer", "Web Designer", "UI/UX Designer" ]'><span className="wrap">{text}</span></span></h1>
                   <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>
-                  <button onClick={() => console.log('connect')}>Let’s Connect <ArrowRightCircle size={25} /></button>
+                  <button onClick={scrollToContacts}>Let’s Connect <ArrowRightCircle size={25} /></button>
               </div>}
             </TrackVisibility>
           </Col>