diff --git a/client/src/app/app.module.ts b/client/src/app/app.module.ts
index 6485c98c9..5887da61d 100644
--- a/client/src/app/app.module.ts
+++ b/client/src/app/app.module.ts
@@ -11,7 +11,6 @@ import { AppComponent } from './app.component'
 import { CoreModule, PluginService, RedirectService, ServerService } from './core'
 import { EmptyComponent } from './empty.component'
 import { HeaderComponent, SearchTypeaheadComponent, SuggestionComponent } from './header'
-import { HighlightPipe } from './header/highlight.pipe'
 import { polyfillICU } from './helpers'
 import { LanguageChooserComponent, MenuComponent, NotificationComponent } from './menu'
 import { AccountSetupWarningModalComponent } from './modal/account-setup-warning-modal.component'
@@ -58,7 +57,6 @@ export function loadConfigFactory (server: ServerService, pluginService: PluginS
     HeaderComponent,
     SearchTypeaheadComponent,
     SuggestionComponent,
-    HighlightPipe,
 
     AccountSetupWarningModalComponent,
     CustomModalComponent,
diff --git a/client/src/app/header/highlight.pipe.ts b/client/src/app/header/highlight.pipe.ts
deleted file mode 100644
index 50ee5c1bd..000000000
--- a/client/src/app/header/highlight.pipe.ts
+++ /dev/null
@@ -1,54 +0,0 @@
-import { PipeTransform, Pipe } from '@angular/core'
-import { SafeHtml } from '@angular/platform-browser'
-
-// Thanks https://gist.github.com/adamrecsko/0f28f474eca63e0279455476cc11eca7#gistcomment-2917369
-@Pipe({ name: 'highlight' })
-export class HighlightPipe implements PipeTransform {
-  /* use this for single match search */
-  static SINGLE_MATCH = 'Single-Match'
-  /* use this for single match search with a restriction that target should start with search string */
-  static SINGLE_AND_STARTS_WITH_MATCH = 'Single-And-StartsWith-Match'
-  /* use this for global search */
-  static MULTI_MATCH = 'Multi-Match'
-
-  transform (
-    contentString: string = null,
-    stringToHighlight: string = null,
-    option = 'Single-And-StartsWith-Match',
-    caseSensitive = false,
-    highlightStyleName = 'search-highlight'
-  ): SafeHtml {
-    if (stringToHighlight && contentString && option) {
-      let regex: any = ''
-      const caseFlag: string = !caseSensitive ? 'i' : ''
-
-      switch (option) {
-        case 'Single-Match': {
-          regex = new RegExp(stringToHighlight, caseFlag)
-          break
-        }
-        case 'Single-And-StartsWith-Match': {
-          regex = new RegExp('^' + stringToHighlight, caseFlag)
-          break
-        }
-        case 'Multi-Match': {
-          regex = new RegExp(stringToHighlight, 'g' + caseFlag)
-          break
-        }
-        default: {
-          // default will be a global case-insensitive match
-          regex = new RegExp(stringToHighlight, 'gi')
-        }
-      }
-
-      const replaced = contentString.replace(
-        regex,
-        (match) => `<span class="${highlightStyleName}">${match}</span>`
-      )
-
-      return replaced
-    } else {
-      return contentString
-    }
-  }
-}
diff --git a/client/src/app/header/suggestion.component.html b/client/src/app/header/suggestion.component.html
index 3f85ed6ae..63737ada6 100644
--- a/client/src/app/header/suggestion.component.html
+++ b/client/src/app/header/suggestion.component.html
@@ -7,8 +7,10 @@
 
   <div
     class="flex-auto overflow-hidden text-start no-wrap css-truncate css-truncate-target"
-    [attr.aria-label]="result.text" [innerHTML]="result.text | highlight : highlight"
-  ></div>
+    [attr.aria-label]="result.text"
+  >
+    {{ result.text }}
+  </div>
 
   <div class="border rounded flex-shrink-0 px-1 bg-gray text-gray-light ms-1 f6">
     <span *ngIf="result.type === 'search-instance'" i18n>In this instance's network</span>