diff --git a/src/runtime/components/forms/Range.vue b/src/runtime/components/forms/Range.vue
index d43f2202d5..85df3e84e6 100644
--- a/src/runtime/components/forms/Range.vue
+++ b/src/runtime/components/forms/Range.vue
@@ -128,8 +128,11 @@ export default defineComponent({
     })
 
     const progressStyle = computed(() => {
+      const { modelValue, min, max } = props
+      const clampedValue = Math.max(min, Math.min(modelValue, max))
+      const relativeValue = (clampedValue - min) / (max - min)
       return {
-        width: `${(props.modelValue / props.max) * 100}%`
+        width: `${relativeValue * 100}%`
       }
     })