After setting the mixin using css animation, I applied the style of each theme.

src/client/styles/scss/_mixins.scss

@@ -253,3 +253,28 @@
     }
   }
 }
+@mixin highlighted($color, $alpha) {
+  @keyframes vanishing {
+    0% {
+      opacity: 1;
+    }
+    100% {
+      opacity: 0;
+    }
+  }
+  position: relative;
+  z-index: 1;
+
+  &::after {
+    position: absolute;
+    top: 15%;
+    left: 0;
+    z-index: -1;
+    width: 100%;
+    height: 70%;
+    content: '';
+    background-color: rgba($color, $alpha);
+    border-radius: 2px;
+    animation: vanishing 1s ease-in 1.5s 1 normal forwards running;
+  }
+}

src/client/styles/scss/_wiki.scss

@@ -27,20 +27,21 @@ div.body {
   }
 
   h1 {
-    padding: 0.5em 0;
+    padding: 1rem 0.25rem;
     margin-top: 2em;
     font-size: 1.8em;
     line-height: 1.1em;
     border-bottom: solid 1px transparent;
   }
   h2 {
-    padding-bottom: 0.5em;
+    padding: 1rem 0.25rem;
     font-size: 1.4em;
     font-weight: bold;
     line-height: 1.225;
     border-bottom: 1px solid transparent;
   }
   h3 {
+    padding: 0 0.25rem;
     font-size: 1.2em;
     font-weight: bold;
   }
@@ -137,10 +138,6 @@ div.body {
     }
   }
 
-  .highlighted {
-    background-color: $warning;
-  }
-
   .revision-head {
     a {
       text-decoration: none;

src/client/styles/scss/theme/_apply-colors-dark.scss

@@ -366,6 +366,9 @@ ul.pagination {
   h2 {
     border-color: $border-color-theme;
   }
+  .highlighted {
+    @include highlighted($primary, 0.4);
+  }
 }
 
 /*

src/client/styles/scss/theme/_apply-colors-light.scss

@@ -272,6 +272,9 @@ $border-color: $border-color-global;
   h2 {
     border-color: $border-color-theme;
   }
+  .highlighted {
+    @include highlighted($primary, 0.1);
+  }
 }
 
 /*

src/client/styles/scss/theme/antarctic.scss

@@ -113,6 +113,13 @@ html[dark] {
   @import 'apply-colors';
   @import 'apply-colors-light';
 
+  // article
+  .wiki {
+    .highlighted {
+      @include highlighted($primary, 0.15);
+    }
+  }
+
   //Button
   .btn-group.grw-page-editor-mode-manager {
     .btn.btn-outline-primary {

src/client/styles/scss/theme/christmas.scss

@@ -107,14 +107,8 @@ html[dark] {
 
   // change color of highlighted header in wiki (default: orange)
   .wiki {
-    .code-line.revision-head.highlighted {
-      color: $themelight;
-      background-color: lighten($themecolor, 20%);
-
-      .icon-note,
-      .icon-link {
-        color: $themelight;
-      }
+    .highlighted {
+      @include highlighted($primary, 0.5);
     }
   }
 

src/client/styles/scss/theme/future.scss

@@ -88,7 +88,12 @@ html[dark] {
 
   @import 'apply-colors';
   @import 'apply-colors-dark';
-
+  // article
+  .wiki {
+    .highlighted {
+      @include highlighted($primary, 0.4);
+    }
+  }
   //Button
   .btn-group.grw-page-editor-mode-manager {
     .btn.btn-outline-primary {

src/client/styles/scss/theme/halloween.scss

@@ -106,7 +106,12 @@ html[dark] {
 
   @import 'apply-colors';
   @import 'apply-colors-dark';
-
+  // article
+  .wiki {
+    .highlighted {
+      @include highlighted($primary, 0.4);
+    }
+  }
   //Button
   .btn-group.grw-page-editor-mode-manager {
     .btn.btn-outline-primary {

src/client/styles/scss/theme/island.scss

@@ -84,9 +84,10 @@ html[dark] {
   @import 'apply-colors';
   @import 'apply-colors-light';
 
+  // article
   .wiki {
     .highlighted {
-      background-color: lighten($primary, 20%);
+      @include highlighted($primary, 0.5);
     }
   }
 

src/client/styles/scss/theme/kibela.scss

@@ -98,6 +98,12 @@ html[dark] {
 
   @import 'apply-colors';
   @import 'apply-colors-light';
+  // article
+  .wiki {
+    .highlighted {
+      @include highlighted($primary, 0.2);
+    }
+  }
   //Button
   .grw-page-editor-mode-manager {
     .btn.btn-outline-primary {

src/client/styles/scss/theme/mono-blue.scss

@@ -75,6 +75,12 @@ html[light] {
   @import 'apply-colors';
   @import 'apply-colors-light';
 
+  // article
+  .wiki {
+    .highlighted {
+      @include highlighted($primary, 0.1);
+    }
+  }
   // Navs {
   .nav-tabs {
     border-bottom: $border-color-theme 1px solid;
@@ -202,4 +208,10 @@ html[dark] {
       @include btn-page-editor-mode-manager(lighten($primary, 30%), $primary, darken($primary, 10%), darken($primary, 20%));
     }
   }
+  // article
+  .wiki {
+    .highlighted {
+      @include highlighted($primary, 0.5);
+    }
+  }
 }

src/client/styles/scss/theme/nature.scss

@@ -96,6 +96,13 @@ html[dark] {
   @import 'apply-colors';
   @import 'apply-colors-light';
 
+  // article
+  .wiki {
+    .highlighted {
+      @include highlighted($primary, 0.1);
+    }
+  }
+
   // Search Top
   .grw-global-search {
     .btn-secondary.dropdown-toggle {

src/client/styles/scss/theme/spring.scss

@@ -92,7 +92,12 @@ html[dark] {
 
   @import 'apply-colors';
   @import 'apply-colors-light';
-
+  // article
+  .wiki {
+    .highlighted {
+      @include highlighted($primary, 0.5);
+    }
+  }
   //Button
   // Outline buttons are applyed the accent color to this spring theme cuz the primary is too light and it looks like unable to click them.
   .btn.btn-outline-primary {

src/client/styles/scss/theme/wood.scss

@@ -124,6 +124,13 @@ html[dark] {
     background-image: url('/images/themes/wood/wood-navbar.jpg');
   }
 
+  // article
+  .wiki {
+    .highlighted {
+      @include highlighted($primary, 0.3);
+    }
+  }
+
   // Sidebar
   .grw-sidebar {
     div[data-testid='GlobalNavigation'] {