diff --git a/modules/blox-tailwind/assets/dist/font/RobotoSlab-VariableFont_wght.ttf b/modules/blox-tailwind/assets/dist/font/RobotoSlab-VariableFont_wght.ttf
new file mode 100644
index 00000000..d78883c1
Binary files /dev/null and b/modules/blox-tailwind/assets/dist/font/RobotoSlab-VariableFont_wght.ttf differ
diff --git a/modules/blox-tailwind/layouts/partials/site_head.html b/modules/blox-tailwind/layouts/partials/site_head.html
index 251a4b27..5134d6a0 100644
--- a/modules/blox-tailwind/layouts/partials/site_head.html
+++ b/modules/blox-tailwind/layouts/partials/site_head.html
@@ -216,7 +216,15 @@
 
   {{/* Load font theme */}}
   {{ $font_family := "Inter var" }}
-  {{ $font_file := "Inter.var.woff2" }}
+  {{ $font_file := "" }}
+  {{ $font_type := "" }}
+  {{ if eq site.Params.appearance.font "serif" }}
+    {{ $font_file = "RobotoSlab-VariableFont_wght.ttf" }}
+    {{ $font_type = "truetype" }}
+  {{else}}
+    {{ $font_file = "Inter.var.woff2" }}
+    {{ $font_type = "woff2" }}
+  {{end}}
   {{ $font := resources.Get (printf "dist/font/%s" $font_file) }}
   <style>
     @font-face {
@@ -224,7 +232,7 @@
       font-style: normal;
       font-weight: 100 900;
       font-display: swap;
-      src: url({{ $font.RelPermalink }}) format("woff2");
+      src: url({{ $font.RelPermalink }}) format({{$font_type}});
     }
   </style>