diff --git a/src/core/base.css b/src/core/base.css
index 3c88445..90966c1 100644
--- a/src/core/base.css
+++ b/src/core/base.css
@@ -34,6 +34,11 @@ a {
     text-decoration: underline;
 }
 
+:where(abbr, dfn)[title] {
+    cursor: help;
+    border-bottom: 1px dotted;
+}
+
 b,
 strong {
     color: var(--strong-color);
diff --git a/themeable.md b/themeable.md
index a8c60ce..4a5b008 100644
--- a/themeable.md
+++ b/themeable.md
@@ -210,6 +210,7 @@ description: >
   <div style="background: var(--rose-800);"></div>
   <div style="background: var(--rose-900);"></div>
 </div>
+
 ## Monochrome Palette
 
 <div style="display: grid; grid-template-columns: repeat(11, 1fr); line-height: 2.25; gap: 1px;">
@@ -453,6 +454,14 @@ console.log(mergedObj);
 
 <br>
 
+<abbr title="Abbreviation">abbr</abbr> tag with title
+
+<abbr>abbr</abbr> (Abbreviation) tag without title
+
+<dfn title="Definition">dfn</dfn> tag with title
+
+<dfn>dfn</dfn> (Definition) tag without title
+
 ## Horizontal Rule
 
 ---