diff --git a/assets/css/main.css b/assets/css/main.css
index 0e96e3e45..38864ce9e 100644
--- a/assets/css/main.css
+++ b/assets/css/main.css
@@ -477,6 +477,10 @@ ul {
   list-style-type: disc;
 }
 
+.tw-scrollbar-thin {
+  scrollbar-width: thin;
+}
+
 :root {
   /* ========== Global ========== */
   /* Color of the background */
diff --git a/assets/css/tailwind.css b/assets/css/tailwind.css
index 1a84b6a84..bb7baa558 100644
--- a/assets/css/tailwind.css
+++ b/assets/css/tailwind.css
@@ -18,6 +18,9 @@
   ul {
     @apply tw-list-disc tw-list-outside;
   }
+  .tw-scrollbar-thin {
+    scrollbar-width: thin;
+  }
   
   :root {
     /* ========== Global ========== */
diff --git a/layouts/_default/_markup/render-codeblock.html b/layouts/_default/_markup/render-codeblock.html
index 0b7d27711..df72aa2d7 100644
--- a/layouts/_default/_markup/render-codeblock.html
+++ b/layouts/_default/_markup/render-codeblock.html
@@ -110,5 +110,7 @@
       group-[.is-closed]:!tw-max-h-0 
       group-[.is-wrap]:tw-text-wrap
       tw-overflow-y-hidden
-      tw-overflow-x-auto">{{ $result.Inner }}</code></pre>
+      tw-overflow-x-auto
+      tw-scrollbar-thin
+      ">{{ $result.Inner }}</code></pre>
 </div>