diff --git a/client/src/components/Chat/Messages/Content/CodeAnalyze.tsx b/client/src/components/Chat/Messages/Content/CodeAnalyze.tsx
index 5f6b4eb8e5..c0ab640dd4 100644
--- a/client/src/components/Chat/Messages/Content/CodeAnalyze.tsx
+++ b/client/src/components/Chat/Messages/Content/CodeAnalyze.tsx
@@ -85,14 +85,14 @@ const CodeInProgress = ({
       style={{ opacity: 1, transform: 'none' }}
       data-projection-id="77"
     >
-      <div>
+      <div className='absolute right-[1.5px] bottom-[1.5px]'>
         <svg
           xmlns="http://www.w3.org/2000/svg"
           xmlnsXlink="http://www.w3.org/1999/xlink"
           viewBox="0 0 20 20"
           width="20"
           height="20"
-          style={{ width: '100%', height: '100%', transform: 'translate3d(0px, 0px, 0px)' }}
+          style={{ transform: 'translate3d(0px, 0px, 0px)' }}
           preserveAspectRatio="xMidYMid meet"
         >
           <defs>
@@ -101,7 +101,10 @@ const CodeInProgress = ({
             </clipPath>
           </defs>
           <g clipPath="url(#__lottie_element_11)">
-            <g style={{ display: 'block', transform: 'matrix(1,0,0,1,-2,-2)', opacity: 1 }}>
+            <g
+              style={{ display: 'block', transform: 'matrix(1,0,0,1,-2,-2)', opacity: 1 }}
+              className="slide-from-left"
+            >
               <g opacity="1" transform="matrix(1,0,0,1,7.026679992675781,8.834091186523438)">
                 <path
                   fill="rgb(177,98,253)"
@@ -119,7 +122,10 @@ const CodeInProgress = ({
                 />
               </g>
             </g>
-            <g style={{ display: 'block', transform: 'matrix(1,0,0,1,-2,-2)', opacity: 1 }}>
+            <g
+              style={{ display: 'block', transform: 'matrix(1,0,0,1,-2,-2)', opacity: 1 }}
+              className="slide-to-down"
+            >
               <g opacity="1" transform="matrix(1,0,0,1,11.79640007019043,13.512199401855469)">
                 <path
                   fill="rgb(177,98,253)"
diff --git a/client/src/style.css b/client/src/style.css
index fbfb83edd3..a1d3fc16b9 100644
--- a/client/src/style.css
+++ b/client/src/style.css
@@ -1984,4 +1984,67 @@ html {
   -webkit-text-fill-color: #fff;
   background-clip: content-box;
   -webkit-box-shadow: 0 0 0 50vh #0d0d0d inset;
-}
\ No newline at end of file
+}
+
+
+@keyframes slideFromLeftToRightAndFade {
+  0% {
+    opacity: 0;
+    transform: translateX(-10%); 
+  }
+  20% {
+    opacity: 1;
+    transform: translateX(0); 
+  }
+  70% {
+    opacity: 1;
+    transform: translateX(0); 
+  }
+  75% {
+    opacity: 1;
+    transform: translateX(10%); 
+  }
+  80% {
+    opacity: 0;
+    transform: translateX(20%); 
+  }
+  85%, 100% {
+    opacity: 0;
+    transform: translateX(30%); 
+  }
+}
+
+.slide-from-left {
+  animation: slideFromLeftToRightAndFade 2s ease-in-out infinite;
+}
+
+@keyframes slideDownAndFadeOut {
+  0% {
+    opacity: 1;
+    transform: translateY(-10%); 
+  }
+  20% {
+    opacity: 1;
+    transform: translateY(0); 
+  }
+  70% {
+    opacity: 1;
+    transform: translateY(0);
+  }
+  75% {
+    opacity: 1;
+    transform: translateY(10%); 
+  }
+  80% {
+    opacity: 0;
+    transform: translateY(20%);
+  }
+  85%, 100% {
+    opacity: 0;
+    transform: translateY(30%); 
+  }
+}
+
+.slide-to-down {
+  animation: slideDownAndFadeOut 2s ease-in-out infinite;
+}