diff --git a/src/main/resources/assets/design-system/misc.scss b/src/main/resources/assets/design-system/misc.scss
index f76647224..bfc1fad7c 100644
--- a/src/main/resources/assets/design-system/misc.scss
+++ b/src/main/resources/assets/design-system/misc.scss
@@ -297,7 +297,7 @@
 
 .sci-preloader {
   --preloader-size: calc(3 * var(--sci-base-unit)); /* Default size */
-  --preloader-border-width: calc(0.2 * var(--sci-base-unit)); /* Default border width */
+  --preloader-border-width: calc(var(--preloader-size) * (0.2 / 3));
 
   position: relative;
   height: var(--preloader-size);
@@ -321,10 +321,11 @@
 }
 
 .sci-preloader-small {
-  --preloader-size: calc(2 * var(--sci-base-unit));
-  --preloader-border-width: calc(0.15 * var(--sci-base-unit));
+  --preloader-size: calc(2 * var(--sci-base-unit)); /* Smaller size */
+  /* No need to redefine --preloader-border-width; it adjusts automatically */
 }
 
+
 @keyframes sciPreloader {
   to {
     transform: rotate(360deg);