diff --git a/src/Umbraco.Web.UI.Client/.storybook/preview.js b/src/Umbraco.Web.UI.Client/.storybook/preview.js
index 73d791ca82..77895c18cc 100644
--- a/src/Umbraco.Web.UI.Client/.storybook/preview.js
+++ b/src/Umbraco.Web.UI.Client/.storybook/preview.js
@@ -36,6 +36,7 @@ import '../libs/element/context-provider.element';
 import '../src/backoffice/shared/components/backoffice-frame/backoffice-modal-container.element';
 import '../src/backoffice/shared/components/code-block/code-block.element';
 import '../src/backoffice/shared/components/workspace/workspace-layout/workspace-layout.element';
+import '../src/backoffice/shared/components';
 
 class UmbStoryBookElement extends LitElement {
 	_umbIconStore = new UmbIconStore();
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-slider/input-slider.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-slider/input-slider.element.ts
index 46f89cd3c0..9ffcacdb12 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-slider/input-slider.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-slider/input-slider.element.ts
@@ -38,7 +38,6 @@ export class UmbInputSliderElement extends FormControlMixin(UmbLitElement) {
 	}
 
 	render() {
-		console.log(this.initVal1);
 		if (this.enableRange) return this.#renderRangeSlider();
 		else return this.#renderSlider();
 	}
@@ -56,7 +55,8 @@ export class UmbInputSliderElement extends FormControlMixin(UmbLitElement) {
 			.min="${this.min}"
 			.max="${this.max}"
 			.step="${this.step}"
-			.value="${this.initVal1.toString()},${this.initVal2.toString()}"
+			.valueLow="${this.initVal1}"
+			.valueHigh="${this.initVal2}"
 			@change="${this.#onChange}"></uui-range-slider>`;
 	}
 }
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/slider/property-editor-ui-slider.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/slider/property-editor-ui-slider.stories.ts
index 983da3c1d3..2c409547b9 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/slider/property-editor-ui-slider.stories.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/slider/property-editor-ui-slider.stories.ts
@@ -11,5 +11,9 @@ export default {
 } as Meta;
 
 export const AAAOverview: Story<UmbPropertyEditorUISliderElement> = () =>
-	html`<umb-property-editor-ui-slider></umb-property-editor-ui-slider>`;
+	html`<umb-property-editor-ui-slider
+		.config="${[
+			{ alias: 'maxVal', value: 50 },
+			{ alias: 'step', value: 5 },
+		]}"></umb-property-editor-ui-slider>`;
 AAAOverview.storyName = 'Overview';
diff --git a/src/Umbraco.Web.UI.Client/src/core/mocks/data/data-type.data.ts b/src/Umbraco.Web.UI.Client/src/core/mocks/data/data-type.data.ts
index 0c99e95cd9..d8ece69dea 100644
--- a/src/Umbraco.Web.UI.Client/src/core/mocks/data/data-type.data.ts
+++ b/src/Umbraco.Web.UI.Client/src/core/mocks/data/data-type.data.ts
@@ -193,7 +193,7 @@ export const data: Array<DataTypeModel & { type: 'data-type' }> = [
 			},
 			{
 				alias: 'initVal2',
-				value: 20,
+				value: 40,
 			},
 			{
 				alias: 'maxVal',