diff --git a/kit/preprocessors/mdsvex/index.js b/kit/preprocessors/mdsvex/index.js
index 3e3e0a77..1177a955 100644
--- a/kit/preprocessors/mdsvex/index.js
+++ b/kit/preprocessors/mdsvex/index.js
@@ -338,6 +338,7 @@ const _mdsvexPreprocess = mdsvex({
 			const base64 = (val) => btoa(encodeURIComponent(val));
 			const escape = (code) =>
 				code.replace(/\\/g, "\\\\").replace(/`/g, "\\`").replace(/}/g, "\\}").replace(/\$/g, "\\$");
+			const safeLang = lang && /^[\w-]+$/.test(lang) ? lang : "";
 			const REGEX_FRAMEWORKS_SPLIT = /\s*===(PT-TF|STRINGAPI-READINSTRUCTION)-SPLIT===\s*/gm;
 
 			// Handle mermaid diagrams
@@ -380,6 +381,7 @@ const _mdsvexPreprocess = mdsvex({
 			code: \`${base64(codeGroup2)}\`,
 			highlighted: \`${escape(highlightedTf)}\`
 		}}
+		lang="${safeLang}"
 		wrap={${wrapCodeBlocks}}
 	/>`;
 			} else {
@@ -394,9 +396,10 @@ const _mdsvexPreprocess = mdsvex({
 						.join("\n");
 				}
 				return `
-	<CodeBlock 
+	<CodeBlock
 		code={\`${base64(code)}\`}
 		highlighted={\`${escape(highlighted)}\`}
+		lang="${safeLang}"
 		wrap={${wrapCodeBlocks}}
 	/>`;
 			}
diff --git a/kit/src/lib/CodeBlock.svelte b/kit/src/lib/CodeBlock.svelte
index 2d6e7d2c..ac920842 100644
--- a/kit/src/lib/CodeBlock.svelte
+++ b/kit/src/lib/CodeBlock.svelte
@@ -3,6 +3,7 @@
 	let hideCopyButton = true;
 	export let code = "";
 	export let highlighted = "";
+	export let lang = "";
 	export let wrap = false;
 	export let classNames = "";
 
@@ -28,5 +29,8 @@
 			value={code}
 		/>
 	</div>
-	<pre class={wrap ? "whitespace-pre-wrap" : ""}>{@html highlighted}</pre>
+	<pre
+		class="{lang ? `language-${lang}` : ''} {wrap
+			? 'whitespace-pre-wrap'
+			: ''}">{@html highlighted}</pre>
 </div>
diff --git a/kit/src/lib/CodeBlockFw.svelte b/kit/src/lib/CodeBlockFw.svelte
index 7c4896fb..16fee660 100644
--- a/kit/src/lib/CodeBlockFw.svelte
+++ b/kit/src/lib/CodeBlockFw.svelte
@@ -5,6 +5,7 @@
 
 	export let group1: { id: string; code: string; highlighted: string };
 	export let group2: { id: string; code: string; highlighted: string };
+	export let lang = "";
 	export let wrap = false;
 
 	const ids = [group1.id, group2.id];
@@ -36,7 +37,8 @@
 				value={group1.code}
 			/>
 		</div>
-		<pre class={wrap ? "whitespace-pre-wrap" : ""}><FrameworkSwitch
+		<pre
+			class="{lang ? `language-${lang}` : ''} {wrap ? 'whitespace-pre-wrap' : ''}"><FrameworkSwitch
 				{ids}
 			/>{@html group1.highlighted}</pre>
 	{:else}
@@ -47,7 +49,8 @@
 				value={group2.code}
 			/>
 		</div>
-		<pre class={wrap ? "whitespace-pre-wrap" : ""}><FrameworkSwitch
+		<pre
+			class="{lang ? `language-${lang}` : ''} {wrap ? 'whitespace-pre-wrap' : ''}"><FrameworkSwitch
 				{ids}
 			/>{@html group2.highlighted}</pre>
 	{/if}