diff --git a/packages/bruno-app/src/components/RequestPane/QueryUrl/index.js b/packages/bruno-app/src/components/RequestPane/QueryUrl/index.js
index c83977ef8..b5c761a7c 100644
--- a/packages/bruno-app/src/components/RequestPane/QueryUrl/index.js
+++ b/packages/bruno-app/src/components/RequestPane/QueryUrl/index.js
@@ -81,7 +81,9 @@ const QueryUrl = ({ item, collection, handleRun }) => {
     }
   };
 
-  const handleCancelRequest = () => {
+  const handleCancelRequest = (e) => {
+    e.preventDefault();
+    e.stopPropagation();
     dispatch(cancelRequest(item.cancelTokenUid, item, collection));
   };
 
@@ -148,7 +150,7 @@ const QueryUrl = ({ item, collection, handleRun }) => {
           </div>
           {isLoading || item.response?.stream?.running ? (
             <IconSquareRoundedX
-              color={theme.requestTabPanel.url.icon}
+              color={theme.requestTabPanel.url.iconDanger}
               strokeWidth={1.5}
               size={22}
               data-testid="cancel-request-icon"
diff --git a/packages/bruno-app/src/themes/dark.js b/packages/bruno-app/src/themes/dark.js
index 34cb27874..7c5af6554 100644
--- a/packages/bruno-app/src/themes/dark.js
+++ b/packages/bruno-app/src/themes/dark.js
@@ -115,6 +115,7 @@ const darkTheme = {
     url: {
       bg: '#3D3D3D',
       icon: 'rgb(204, 204, 204)',
+      iconDanger: '#fa5343',
       errorHoverBg: '#4a2a2a'
     },
     dragbar: {
diff --git a/packages/bruno-app/src/themes/light.js b/packages/bruno-app/src/themes/light.js
index 794925883..05b40766e 100644
--- a/packages/bruno-app/src/themes/light.js
+++ b/packages/bruno-app/src/themes/light.js
@@ -115,6 +115,7 @@ const lightTheme = {
     url: {
       bg: '#f3f3f3',
       icon: '#515151',
+      iconDanger: '#d91f11',
       errorHoverBg: '#fef2f2'
     },
     dragbar: {