diff --git a/services/web/frontend/js/features/source-editor/components/codemirror-search-form.tsx b/services/web/frontend/js/features/source-editor/components/codemirror-search-form.tsx
index 3a7069bfa8..e822047590 100644
--- a/services/web/frontend/js/features/source-editor/components/codemirror-search-form.tsx
+++ b/services/web/frontend/js/features/source-editor/components/codemirror-search-form.tsx
@@ -225,7 +225,13 @@ const CodeMirrorSearchForm: FC = () => {
       role="search"
     >
       <div className="ol-cm-search-controls">
-        <InputGroup bsSize="small" className="ol-cm-search-input-group">
+        <InputGroup
+          bsSize="small"
+          className={classnames('ol-cm-search-input-group', {
+            'ol-cm-search-input-error':
+              query.regexp && isInvalidRegExp(query.search),
+          })}
+        >
           <FormControl
             type="text"
             name="search"
@@ -419,4 +425,13 @@ const CodeMirrorSearchForm: FC = () => {
   )
 }
 
+function isInvalidRegExp(source: string) {
+  try {
+    RegExp(source)
+    return false
+  } catch {
+    return true
+  }
+}
+
 export default CodeMirrorSearchForm
diff --git a/services/web/frontend/js/features/source-editor/extensions/search.ts b/services/web/frontend/js/features/source-editor/extensions/search.ts
index f094abdd04..96dba7e17c 100644
--- a/services/web/frontend/js/features/source-editor/extensions/search.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/search.ts
@@ -164,6 +164,8 @@ export const search = () => {
         background: 'var(--ol-blue-gray-1)',
         '--ol-cm-search-form-focus-shadow':
           'inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(102 175 233 / 60%)',
+        '--ol-cm-search-form-error-shadow':
+          'inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px var(--input-shadow-danger-color)',
       },
       '.ol-cm-search-controls': {
         display: 'grid',
@@ -218,6 +220,12 @@ export const search = () => {
           boxShadow: 'var(--ol-cm-search-form-focus-shadow)',
         },
       },
+      '.ol-cm-search-input-group.ol-cm-search-input-error': {
+        '&:focus-within': {
+          borderColor: 'var(--input-border-danger)',
+          boxShadow: 'var(--ol-cm-search-form-error-shadow)',
+        },
+      },
       '.input-group .ol-cm-search-form-input': {
         border: 'none',
       },
diff --git a/services/web/frontend/stylesheets/core/css-variables.less b/services/web/frontend/stylesheets/core/css-variables.less
index f6bca99b57..102e131732 100644
--- a/services/web/frontend/stylesheets/core/css-variables.less
+++ b/services/web/frontend/stylesheets/core/css-variables.less
@@ -13,6 +13,8 @@
   --input-border: @input-border;
   --input-border-radius: @input-border-radius;
   --input-border-focus: @input-border-focus;
+  --input-border-danger: @state-danger-border;
+  --input-shadow-danger-color: fade(@state-danger-border, 50%);
 
   --btn-border-radius-base: @btn-border-radius-base;
   --btn-default-bg: @btn-default-bg;
diff --git a/services/web/frontend/stylesheets/variables/css-variables.less b/services/web/frontend/stylesheets/variables/css-variables.less
index 9d52bf822e..c0f8176736 100644
--- a/services/web/frontend/stylesheets/variables/css-variables.less
+++ b/services/web/frontend/stylesheets/variables/css-variables.less
@@ -63,6 +63,8 @@
   --input-border: @input-border;
   --input-border-radius: @input-border-radius;
   --input-border-focus: @input-border-focus;
+  --input-border-danger: @state-danger-border;
+  --input-shadow-danger-color: fade(@state-danger-border, 50%);
 
   // border
   --btn-border-radius-base: @btn-border-radius-base;