diff --git a/layouts/_default/_markup/render-heading.html b/layouts/_default/_markup/render-heading.html
new file mode 100644
index 0000000..506292f
--- /dev/null
+++ b/layouts/_default/_markup/render-heading.html
@@ -0,0 +1,9 @@
+<h{{ .Level }} id="{{ .Anchor | safeURL }}">
+    <a class="hash-link nohover" href="#{{ .Anchor | safeURL }}">
+        <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="red" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+            <title>Link to this section</title>
+            <path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"></path>
+            <path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"></path>
+        </svg>
+    </a>&nbsp;{{ .Text | safeHTML }}
+</h{{ .Level }}>
\ No newline at end of file
diff --git a/static/css/heading.css b/static/css/heading.css
new file mode 100644
index 0000000..c5e37a8
--- /dev/null
+++ b/static/css/heading.css
@@ -0,0 +1,13 @@
+.hash-link {
+    /* -webkit-transform: translateX(-100%); */
+    /* left: 0;
+    opacity: 0;
+    padding: 0 5px;
+    position: absolute;
+    transform: translateX(-100%);
+    transition: opacity .1s ease-in;
+    will-change: transform, opacity; */
+    svg {
+        stroke: rgb(138, 173, 244);
+    }
+}
\ No newline at end of file
diff --git a/themes/hello-friend-ng/layouts/_default/baseof.html b/themes/hello-friend-ng/layouts/_default/baseof.html
index 4cf9ca4..ee90f6b 100644
--- a/themes/hello-friend-ng/layouts/_default/baseof.html
+++ b/themes/hello-friend-ng/layouts/_default/baseof.html
@@ -4,6 +4,7 @@
 <head>
     {{ partial "head.html" . }}
     <link rel="stylesheet" href="/mermaid.css">
+    <link rel="stylesheet" href="/css/heading.css">
 </head>
 
 {{ block "body" . }}
