diff --git a/src/Umbraco.Web.UI.Client/src/packages/property-editors/slider/property-editor-ui-slider.element.ts b/src/Umbraco.Web.UI.Client/src/packages/property-editors/slider/property-editor-ui-slider.element.ts
index 7202a0e904..511382b107 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/property-editors/slider/property-editor-ui-slider.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/property-editors/slider/property-editor-ui-slider.element.ts
@@ -1,5 +1,5 @@
 import type { UmbInputSliderElement } from '../../core/components/input-slider/input-slider.element.js';
-import { html, customElement, property, state } from '@umbraco-cms/backoffice/external/lit';
+import { customElement, html, property, state } from '@umbraco-cms/backoffice/external/lit';
 import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
 import { UmbPropertyValueChangeEvent } from '@umbraco-cms/backoffice/property-editor';
 import type { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor';
@@ -14,7 +14,7 @@ export class UmbPropertyEditorUISliderElement extends UmbLitElement implements U
 	value: { to?: number; from?: number } | undefined = undefined;
 
 	@state()
-	_enableRange?: boolean;
+	_enableRange = false;
 
 	@state()
 	_initVal1?: number;
@@ -23,21 +23,23 @@ export class UmbPropertyEditorUISliderElement extends UmbLitElement implements U
 	_initVal2?: number;
 
 	@state()
-	_step?: number;
+	_step = 1;
 
 	@state()
-	_min?: number;
+	_min = 0;
 
 	@state()
-	_max?: number;
+	_max = 100;
 
 	public set config(config: UmbPropertyEditorConfigCollection | undefined) {
-		this._enableRange = config?.getValueByAlias('enableRange');
-		this._initVal1 = config?.getValueByAlias('initVal1');
-		this._initVal2 = config?.getValueByAlias('initVal2');
-		this._step = config?.getValueByAlias('step');
-		this._min = config?.getValueByAlias('minVal');
-		this._max = config?.getValueByAlias('maxVal');
+		if (!config) return;
+
+		this._enableRange = Boolean(config.getValueByAlias('enableRange')) ?? false;
+		this._initVal1 = Number(config.getValueByAlias('initVal1'));
+		this._initVal2 = Number(config.getValueByAlias('initVal2'));
+		this._step = Number(config.getValueByAlias('step')) ?? 1;
+		this._min = Number(config.getValueByAlias('minVal')) ?? 0;
+		this._max = Number(config.getValueByAlias('maxVal')) ?? 100;
 	}
 
 	#getValueObject(value: string) {
@@ -45,21 +47,23 @@ export class UmbPropertyEditorUISliderElement extends UmbLitElement implements U
 		return { from, to: to ?? from };
 	}
 
-	#onChange(event: CustomEvent) {
-		const element = event.target as UmbInputSliderElement;
-		this.value = this.#getValueObject(element.value as string);
+	#onChange(event: CustomEvent & { target: UmbInputSliderElement }) {
+		this.value = this.#getValueObject(event.target.value as string);
 		this.dispatchEvent(new UmbPropertyValueChangeEvent());
 	}
 
 	render() {
-		return html`<umb-input-slider
-			.valueLow=${this.value?.from ?? this._initVal1 ?? 0}
-			.valueHigh=${this.value?.to ?? this._initVal2 ?? 0}
-			.step=${this._step ?? 0}
-			.min=${this._min ?? 0}
-			.max=${this._max ?? 0}
-			?enable-range=${this._enableRange}
-			@change=${this.#onChange}></umb-input-slider>`;
+		return html`
+			<umb-input-slider
+				.valueLow=${this.value?.from ?? this._initVal1 ?? 0}
+				.valueHigh=${this.value?.to ?? this._initVal2 ?? 0}
+				.step=${this._step}
+				.min=${this._min}
+				.max=${this._max}
+				?enable-range=${this._enableRange}
+				@change=${this.#onChange}>
+			</umb-input-slider>
+		`;
 	}
 }