diff --git a/assets/css/theme.css b/assets/css/theme.css
index 5e78036..1485dcd 100644
--- a/assets/css/theme.css
+++ b/assets/css/theme.css
@@ -1,6 +1,7 @@
 :root {
     --primary: #f65596;
     --primary-light-10: #f075a6;
+    --primary-light-30: #f7c9dc;
 
     --grey-dark-50: #111;
     --grey-dark-40: #222;
diff --git a/components/form/range.vue b/components/form/range.vue
index e3e40cc..a46a7c9 100755
--- a/components/form/range.vue
+++ b/components/form/range.vue
@@ -152,7 +152,7 @@ async function setRange(prop, value) {
 
 .range {
 	--slider-track: var(--shadow-weak-30);
-	--slider-range: var(--primary-faded);
+	--slider-range: var(--primary-light-30);
 	--slider-thumb: var(--primary);
 
 	position: relative;