diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/modals/basic/basic-modal.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/modals/basic/basic-modal.element.ts
index f8471af0ba..b8960bc69b 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/modals/basic/basic-modal.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/modals/basic/basic-modal.element.ts
@@ -10,8 +10,8 @@ export interface UmbBasicModalData {
 	overlaySize?: UUIModalSidebarSize;
 }
 
-@customElement('umb-modal-layout-basic')
-export class UmbModalLayoutBasicElement extends UmbModalLayoutElement<UmbBasicModalData> {
+@customElement('umb-basic-modal')
+export class UmbBasicModalElement extends UmbModalLayoutElement<UmbBasicModalData> {
 	static styles = [
 		UUITextStyles,
 		css`
@@ -42,10 +42,10 @@ export class UmbModalLayoutBasicElement extends UmbModalLayoutElement<UmbBasicMo
 	}
 }
 
-export default UmbModalLayoutBasicElement;
+export default UmbBasicModalElement;
 
 declare global {
 	interface HTMLElementTagNameMap {
-		'umb-modal-layout-basic': UmbModalLayoutBasicElement;
+		'umb-basic-modal': UmbBasicModalElement;
 	}
 }
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/modals/basic/basic-modal.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/modals/basic/basic-modal.stories.ts
index 81dc5af7bf..6e1c887d98 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/modals/basic/basic-modal.stories.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/modals/basic/basic-modal.stories.ts
@@ -1,11 +1,11 @@
 import { Meta, Story } from '@storybook/web-components';
 import { html } from 'lit';
-import { UmbModalLayoutBasicElement, UmbBasicModalData } from './basic-modal.element';
+import { UmbBasicModalElement, UmbBasicModalData } from './basic-modal.element';
 
 export default {
 	title: 'API/Modals/Layouts/Basic',
-	component: 'umb-modal-layout-basic',
-	id: 'modal-layout-basic',
+	component: 'umb-basic-modal',
+	id: 'umb-basic-modal',
 } as Meta;
 
 const htmlContent = html` <uui-table aria-label="Example table" aria-describedby="#some-element-id">
@@ -35,9 +35,9 @@ const data: UmbBasicModalData = {
 	overlaySize: 'small',
 };
 
-export const Overview: Story<UmbModalLayoutBasicElement> = () => html`
+export const Overview: Story<UmbBasicModalElement> = () => html`
 	<!-- TODO: figure out if generics are allowed for properties:
 	https://github.com/runem/lit-analyzer/issues/149
 	https://github.com/runem/lit-analyzer/issues/163 -->
-	<umb-modal-layout-basic .data=${data as any}></umb-modal-layout-basic>
+	<umb-basic-modal .data=${data as any}></umb-basic-modal>
 `;