diff --git a/assets/css/_page/_single.scss b/assets/css/_page/_single.scss
index c9c02e29f..05f59d448 100644
--- a/assets/css/_page/_single.scss
+++ b/assets/css/_page/_single.scss
@@ -289,6 +289,20 @@
       }
     }
 
+    mark {
+      padding: 0.14em 0.28em;
+      background-color: var(--#{$prefix}mark-background-color, mark);
+      color: var(--#{$prefix}mark-color, marktext);
+      @include border-radius($global-border-radius);
+
+      @each $color, $value in $theme-colors {
+        &.mark-#{$color} {
+          --#{$prefix}mark-color: #fff;
+          --#{$prefix}mark-background-color: var(--#{$prefix}#{$color});
+        }
+      }
+    }
+
     .table-wrapper {
       overflow-x: auto;
       --#{$prefix}scrollbar-thumb-color: #{$table-background-color};
diff --git a/layouts/partials/function/content.html b/layouts/partials/function/content.html
index 426b653c3..5a5362ce3 100644
--- a/layouts/partials/function/content.html
+++ b/layouts/partials/function/content.html
@@ -15,7 +15,7 @@
   {{- end -}}
 
   {{- $content = partial "function/task-lists.html" $content -}}
-
+  {{- $content = partial "function/marked-text.html" $content -}}
   {{- $content = partial "function/escape.html" $content -}}
 
 {{- end -}}
diff --git a/layouts/partials/function/marked-text.html b/layouts/partials/function/marked-text.html
new file mode 100644
index 000000000..f7de73d4a
--- /dev/null
+++ b/layouts/partials/function/marked-text.html
@@ -0,0 +1,10 @@
+{{- /*
+  Marked texts rendering
+  This is an experimental syntax highlighting for the marked texts.
+  Embed types: default, primary, secondary, success, warning, danger
+*/ -}}
+
+{{- $content := replaceRE `<mark>(.+?)</mark>\[(.+?)\]` `<mark class="mark-$2">$1</mark>` . -}}
+{{- $content = replaceRE `<mark>(.+?)</mark>` `<mark class="mark-default">$1</mark>` $content -}}
+
+{{- return $content -}}