diff --git a/scss/forms/_basics.scss b/scss/forms/_basics.scss
index 17cfbe1c..ba77997d 100644
--- a/scss/forms/_basics.scss
+++ b/scss/forms/_basics.scss
@@ -237,7 +237,8 @@
         [type="datetime-local"],
         [type="month"],
         [type="time"],
-        [type="week"]
+        [type="week"],
+        [type="range"]
       ) {
       &[aria-invalid] {
         @if $enable-important {
diff --git a/scss/forms/_input-range.scss b/scss/forms/_input-range.scss
index 65815aa6..276c5297 100644
--- a/scss/forms/_input-range.scss
+++ b/scss/forms/_input-range.scss
@@ -2,7 +2,7 @@
 @use "../settings" as *;
 
 // Config
-$height-track: 0.25rem;
+$height-track: 0.375rem;
 $height-thumb: 1.25rem;
 $border-thumb: 2px;
 
@@ -72,15 +72,13 @@ $border-thumb: 2px;
       @include slider-thumb;
     }
 
-    &:hover,
-    &:focus {
+    &:active,
+    &:focus-within {
       #{$✨}range-border-color: var(#{$✨}range-active-border-color);
-      #{$✨}range-thumb-color: var(#{$✨}range-thumb-hover-color);
+      #{$✨}range-thumb-color: var(#{$✨}range-thumb-active-color);
     }
 
     &:active {
-      #{$✨}range-thumb-color: var(#{$✨}range-thumb-active-color);
-
       // Slider Thumb
       &::-webkit-slider-thumb {
         transform: scale(1.25);
diff --git a/scss/themes/default/_dark.scss b/scss/themes/default/_dark.scss
index 2a8d71bf..8566b274 100644
--- a/scss/themes/default/_dark.scss
+++ b/scss/themes/default/_dark.scss
@@ -148,8 +148,7 @@
     #{$✨}range-active-border-color: #{$slate-800};
     #{$✨}range-thumb-border-color: var(#{$✨}background-color);
     #{$✨}range-thumb-color: var(#{$✨}secondary-background);
-    #{$✨}range-thumb-hover-color: var(#{$✨}secondary-background-hover);
-    #{$✨}range-thumb-active-color: var(#{$✨}primary);
+    #{$✨}range-thumb-active-color: var(#{$✨}primary-background);
   }
 
   // Accordion (<details>)
diff --git a/scss/themes/default/_light.scss b/scss/themes/default/_light.scss
index fbf5f4e6..496d108b 100644
--- a/scss/themes/default/_light.scss
+++ b/scss/themes/default/_light.scss
@@ -148,8 +148,7 @@
     #{$✨}range-active-border-color: #{$slate-200};
     #{$✨}range-thumb-border-color: var(#{$✨}background-color);
     #{$✨}range-thumb-color: var(#{$✨}secondary-background);
-    #{$✨}range-thumb-hover-color: var(#{$✨}secondary-background-hover);
-    #{$✨}range-thumb-active-color: var(#{$✨}primary);
+    #{$✨}range-thumb-active-color: var(#{$✨}primary-background);
   }
 
   // Accordion (<details>)