diff --git a/src/Umbraco.Web.UI.Client/.vscode/lit.code-snippets b/src/Umbraco.Web.UI.Client/.vscode/lit.code-snippets
index fd01fd2b4c..38ffed71f5 100644
--- a/src/Umbraco.Web.UI.Client/.vscode/lit.code-snippets
+++ b/src/Umbraco.Web.UI.Client/.vscode/lit.code-snippets
@@ -4,18 +4,21 @@
 		"scope": "typescript",
 		"body": [
 			"import { UUITextStyles } from '@umbraco-ui/uui-css';",
-			"import { css, html, LitElement } from 'lit';",
+			"import { css, html } from 'lit';",
 			"import { customElement } from 'lit/decorators.js';",
+			"import { UmbLitElement } from '@umbraco-cms/internal/lit-element';",
 			"",
 			"@customElement('umb-${TM_FILENAME_BASE/(.*)\\..+$/$1/}')",
-			"export class Umb${TM_FILENAME_BASE/(.*)\\..+$/${1:/pascalcase}/}Element extends LitElement {",
-			"\tstatic styles = [UUITextStyles, css``];",
-			"",
+			"export class Umb${TM_FILENAME_BASE/(.*)\\..+$/${1:/pascalcase}/}Element extends UmbLitElement {",
 			"\trender() {",
 			"\t\treturn html`${0:umb-${TM_FILENAME_BASE/(.*)\\..+$/$1/}}`;",
 			"\t}",
+			"",
+			"\tstatic styles = [UUITextStyles, css``];",
 			"}",
 			"",
+			"export default Umb${TM_FILENAME_BASE/(.*)\\..+$/${1:/pascalcase}/}Element",
+			"",
 			"declare global {",
 			"\tinterface HTMLElementTagNameMap {",
 			"\t\t'umb-${TM_FILENAME_BASE/(.*)\\..+$/$1/}': Umb${TM_FILENAME_BASE/(.*)\\..+$/${1:/pascalcase}/}Element;",