diff --git a/client/src/app/header/highlight.pipe.ts b/client/src/app/header/highlight.pipe.ts
deleted file mode 100644
index f1af8a470..000000000
--- a/client/src/app/header/highlight.pipe.ts
+++ /dev/null
@@ -1,57 +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',
-  standalone: true
-})
-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>
diff --git a/client/src/app/header/suggestion.component.ts b/client/src/app/header/suggestion.component.ts
index 235dd44da..d40acfe6b 100644
--- a/client/src/app/header/suggestion.component.ts
+++ b/client/src/app/header/suggestion.component.ts
@@ -1,8 +1,7 @@
 import { ListKeyManagerOption } from '@angular/cdk/a11y'
+import { NgIf } from '@angular/common'
 import { Component, Input, OnInit } from '@angular/core'
 import { RouterLink } from '@angular/router'
-import { HighlightPipe } from './highlight.pipe'
-import { NgIf } from '@angular/common'
 import { GlobalIconComponent } from '../shared/shared-icons/global-icon.component'
 
 export type SuggestionPayload = {
@@ -19,7 +18,7 @@ export type SuggestionPayloadType = 'search-instance' | 'search-index'
   templateUrl: './suggestion.component.html',
   styleUrls: [ './suggestion.component.scss' ],
   standalone: true,
-  imports: [ GlobalIconComponent, NgIf, HighlightPipe ]
+  imports: [ GlobalIconComponent, NgIf ]
 })
 export class SuggestionComponent implements OnInit, ListKeyManagerOption {
   @Input() result: SuggestionPayload