diff --git a/libs/remix-ui/statusbar/src/css/statusbar.css b/libs/remix-ui/statusbar/src/css/statusbar.css
index a5c2c53170..a16847e924 100644
--- a/libs/remix-ui/statusbar/src/css/statusbar.css
+++ b/libs/remix-ui/statusbar/src/css/statusbar.css
@@ -7,3 +7,10 @@ remixui_statusbar:hover {
 .remixui_statusbar_gitstatus:hover {
   cursor: pointer;
 }
+
+/**
+ * approximately same height with vscode statusbar
+ **/
+.remixui_statusbar_height {
+  height: 21px;
+}
diff --git a/libs/remix-ui/statusbar/src/lib/components/scamAlertStatus.tsx b/libs/remix-ui/statusbar/src/lib/components/scamAlertStatus.tsx
index eada9d0b7c..33509bf1c6 100644
--- a/libs/remix-ui/statusbar/src/lib/components/scamAlertStatus.tsx
+++ b/libs/remix-ui/statusbar/src/lib/components/scamAlertStatus.tsx
@@ -12,8 +12,8 @@ export default function ScamAlertStatus ({ refs, getReferenceProps }: ScamAlertS
 
   return (
     <>
-      <div className="p-1" id="hTScamAlertSection" ref={refs.setReference} {...getReferenceProps()}>
-        <span className="pr-2 text-danger far fa-exclamation-triangle" style={{ color: '#ff8559', fontSize: 'large' }}></span>
+      <div className="mr-2" id="hTScamAlertSection" ref={refs.setReference} {...getReferenceProps()}>
+        <span className="pr-2 text-danger far fa-exclamation-triangle" style={{ color: '#ff8559' }}></span>
         <label className="text-white font-semibold">
           <FormattedMessage id="home.scamAlert" />
         </label>
diff --git a/libs/remix-ui/statusbar/src/lib/remixui-statusbar-panel.tsx b/libs/remix-ui/statusbar/src/lib/remixui-statusbar-panel.tsx
index 1db325a1de..55692de8ad 100644
--- a/libs/remix-ui/statusbar/src/lib/remixui-statusbar-panel.tsx
+++ b/libs/remix-ui/statusbar/src/lib/remixui-statusbar-panel.tsx
@@ -68,7 +68,7 @@ export function RemixUIStatusBar({ statusBarPlugin }: RemixUIStatusBarProps) {
           <ScamDetails refs={refs} floatStyle={{ ...floatingStyles, minHeight: '300px', alignContent: 'center', paddingRight: '5px' }} getFloatingProps={getFloatingProps} scamAlerts={scamAlerts} />
         </FloatingFocusManager>
       )}
-      <div className="d-flex flex-row bg-primary justify-content-between align-items-center">
+      <div className="d-flex remixui_statusbar_height flex-row bg-primary justify-content-between align-items-center">
         <div className="remixui_statusbar remixui_statusbar_gitstatus">
           <GitStatus plugin={statusBarPlugin} gitBranchName={gitBranchName} setGitBranchName={setGitBranchName} />
         </div>