diff --git a/libs/remix-ui/terminal/src/lib/remix-ui-terminal.css b/libs/remix-ui/terminal/src/lib/remix-ui-terminal.css
index 2224326f5d..894a7bfd05 100644
--- a/libs/remix-ui/terminal/src/lib/remix-ui-terminal.css
+++ b/libs/remix-ui/terminal/src/lib/remix-ui-terminal.css
@@ -23,6 +23,7 @@ element.style {
   border: 1px solid #3f4455!important;
 }
 
+/* seleted option should reflect the theme color */
 .selectedOptions {
   background-color: #222336;
 }
diff --git a/libs/remix-ui/terminal/src/lib/remix-ui-terminal.tsx b/libs/remix-ui/terminal/src/lib/remix-ui-terminal.tsx
index 42cc08ea73..0cdf083af7 100644
--- a/libs/remix-ui/terminal/src/lib/remix-ui-terminal.tsx
+++ b/libs/remix-ui/terminal/src/lib/remix-ui-terminal.tsx
@@ -744,7 +744,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
       <div>
         {autoCompletState.data._options.map((item, index) => {
           return (
-            <div key={index} data-id="autoCompletePopUpAutoCompleteItem" className={`autoCompleteItem listHandlerShow item ${autoCompletState.data._options[autoCompletState.activeSuggestion] === item ? 'border border-primary selectedOptions' : ''}`} onKeyDown={ handleSelect } >
+            <div key={index} data-id="autoCompletePopUpAutoCompleteItem" className={`autoCompleteItem listHandlerShow item ${autoCompletState.data._options[autoCompletState.activeSuggestion] === item ? 'border border-primary ' : ''}`} onKeyDown={ handleSelect } >
               <div>
                 {getKeyOf(item)}
               </div>