diff --git a/templates/index.html b/templates/index.html
index 6145cee..a10807f 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -6,7 +6,7 @@
 <a class="{{ class }} hover:-translate-y-1 transition-all border p-4 rounded-xl flex items-center gap-2"
   href="{{ href }}">
   <div class="flex-1 flex flex-col gap-2">
-    <p class="uppercase text-xs text-gray-500 flex gap-2 items-center">
+    <p class="[font-variant:small-caps] text-xs text-gray-500 flex gap-2 items-center">
       <i class="bi {{ icon_class }}"></i>
       <span>{{ label }}</span>
     </p>
diff --git a/templates/shortcodes/alert.html b/templates/shortcodes/alert.html
index f393be4..0bd054d 100644
--- a/templates/shortcodes/alert.html
+++ b/templates/shortcodes/alert.html
@@ -10,7 +10,7 @@
 {% endif %}
 
 <div class="{{ class }} border p-4 rounded-xl flex-1 flex flex-col gap-2">
-  <p class="not-prose uppercase text-xs text-gray-500 flex gap-2 items-center">
+  <p class="not-prose [font-variant:small-caps] text-xs text-gray-500 flex gap-2 items-center">
     <i class="{{ icon_class }}"></i>
     <span>{{ title }}</span>
   </p>