diff --git a/themes/beaver/assets/css/single-post.css b/themes/beaver/assets/css/single-post.css
index 346b22733..0fa1805ce 100644
--- a/themes/beaver/assets/css/single-post.css
+++ b/themes/beaver/assets/css/single-post.css
@@ -29,6 +29,11 @@
   height: 100%;
 }
 
-.text-decoration-none {
-  text-decoration: none !important;
+.heading-component .heading-self-link {
+  text-decoration: none;
+  color: #1a8cff;
+  visibility: hidden;
+}
+.heading-component:hover>.heading-self-link {
+  visibility: visible;
 }
\ No newline at end of file
diff --git a/themes/beaver/layouts/_default/_markup/render-heading.html b/themes/beaver/layouts/_default/_markup/render-heading.html
index 560d77c80..807b903dd 100644
--- a/themes/beaver/layouts/_default/_markup/render-heading.html
+++ b/themes/beaver/layouts/_default/_markup/render-heading.html
@@ -1 +1 @@
-<h{{ .Level }} id="{{ .Anchor | safeURL }}">{{ .Text | safeHTML }} <a href="#{{ .Anchor | safeURL }}" class="text-decoration-none">#</a></h{{ .Level }}>
+<h{{ .Level }} id="{{ .Anchor | safeURL }}" class="heading-component">{{ .Text | safeHTML }} <a href="#{{ .Anchor | safeURL }}" class="heading-self-link" aria-label="Link to {{ .Text }}" title="Link to this section">#</a></h{{ .Level }}>