diff --git a/src/Umbraco.Web.UI.Client/.storybook/preview-body.html b/src/Umbraco.Web.UI.Client/.storybook/preview-body.html
new file mode 100644
index 0000000000..9c5b8fea63
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/.storybook/preview-body.html
@@ -0,0 +1,4 @@
+<script>
+	document.body.classList.add('uui-font');
+	document.body.classList.add('uui-text');
+</script>
diff --git a/src/Umbraco.Web.UI.Client/.storybook/preview-head.html b/src/Umbraco.Web.UI.Client/.storybook/preview-head.html
new file mode 100644
index 0000000000..bfdcead0c2
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/.storybook/preview-head.html
@@ -0,0 +1,22 @@
+<style>
+	body {
+		padding: 0px !important;
+	}
+</style>
+
+<script>
+	(function () {
+		window.addEventListener('load', () => {
+			var body = document.querySelector('body');
+			window.addEventListener('keydown', (e) => {
+				if (e.ctrlKey === true && e.key === 'g') {
+					if (body.hasAttribute('baseline-grid')) {
+						body.removeAttribute('baseline-grid');
+					} else {
+						body.setAttribute('baseline-grid', '');
+					}
+				}
+			});
+		});
+	})();
+</script>
diff --git a/src/Umbraco.Web.UI.Client/.storybook/preview.js b/src/Umbraco.Web.UI.Client/.storybook/preview.js
index 48afd568ae..0f2c9ccbbe 100644
--- a/src/Umbraco.Web.UI.Client/.storybook/preview.js
+++ b/src/Umbraco.Web.UI.Client/.storybook/preview.js
@@ -1,9 +1,12 @@
+import '@umbraco-ui/uui-css/dist/uui-css.css';
+import '@umbraco-ui/uui';
+
 export const parameters = {
-  actions: { argTypesRegex: "^on[A-Z].*" },
-  controls: {
-    matchers: {
-      color: /(background|color)$/i,
-      date: /Date$/,
-    },
-  },
-}
\ No newline at end of file
+	actions: { argTypesRegex: '^on[A-Z].*' },
+	controls: {
+		matchers: {
+			color: /(background|color)$/i,
+			date: /Date$/,
+		},
+	},
+};
diff --git a/src/Umbraco.Web.UI.Client/src/installer/installer.stories.ts b/src/Umbraco.Web.UI.Client/src/installer/installer.stories.ts
index 95adad04f5..ce9b8363aa 100644
--- a/src/Umbraco.Web.UI.Client/src/installer/installer.stories.ts
+++ b/src/Umbraco.Web.UI.Client/src/installer/installer.stories.ts
@@ -1,9 +1,11 @@
 import { Story, Meta } from '@storybook/web-components';
-import { html } from 'lit';
+import { html } from 'lit-html';
 import './installer.element';
 
 export default {
 	title: 'Installer/Installer',
+	component: 'umb-installer',
+	id: 'installer',
 } as Meta;
 
 const Template: Story = () => html`<umb-installer></umb-installer>`;
diff --git a/src/Umbraco.Web.UI.Client/src/upgrader/upgrader.stories.ts b/src/Umbraco.Web.UI.Client/src/upgrader/upgrader.stories.ts
index a409a6b8c4..c4921a47a6 100644
--- a/src/Umbraco.Web.UI.Client/src/upgrader/upgrader.stories.ts
+++ b/src/Umbraco.Web.UI.Client/src/upgrader/upgrader.stories.ts
@@ -1,5 +1,5 @@
 import { Story, Meta } from '@storybook/web-components';
-import { html } from 'lit';
+import { html } from 'lit-html';
 import './upgrader.element';
 
 export default {