diff --git a/packages/pixi-svelte/src/lib/components/App.svelte b/packages/pixi-svelte/src/lib/components/App.svelte
index b9ce3b379..64b6611a1 100644
--- a/packages/pixi-svelte/src/lib/components/App.svelte
+++ b/packages/pixi-svelte/src/lib/components/App.svelte
@@ -7,7 +7,7 @@
 	import InitialiseParent from './InitialiseParent.svelte';
 	import AssetsLoader from './AssetsLoader.svelte';
 
-	type Props = { children: Snippet };
+	type Props = { children: Snippet; rendererPreference?: 'webgpu' | 'webgl' };
 
 	const props: Props = $props();
 	const context = getContextApp();
@@ -16,7 +16,7 @@
 	onDestroy(() => context.stateApp.reset());
 </script>
 
-<InitialiseApplication>
+<InitialiseApplication rendererPreference={props.rendererPreference}>
 	<InitialiseParent>
 		<AssetsLoader>
 			{@render props.children()}
diff --git a/packages/pixi-svelte/src/lib/components/InitialiseApplication.svelte b/packages/pixi-svelte/src/lib/components/InitialiseApplication.svelte
index 25eaa684a..0f0dc8899 100644
--- a/packages/pixi-svelte/src/lib/components/InitialiseApplication.svelte
+++ b/packages/pixi-svelte/src/lib/components/InitialiseApplication.svelte
@@ -6,7 +6,7 @@
 	import { getContextApp } from '../context.svelte';
 	import { preloadFont } from '../utils.svelte';
 
-	type Props = { children: Snippet };
+	type Props = { children: Snippet; rendererPreference?: 'webgpu' | 'webgl' };
 
 	const props: Props = $props();
 	const context = getContextApp();
@@ -26,7 +26,7 @@
 			multiView: false,
 			antialias: true,
 			clearBeforeRender: true,
-			preference: 'webgpu',
+			preference: props.rendererPreference ?? 'webgpu',
 			powerPreference: 'high-performance',
 			resolution: devicePixelRatio.current,
 			resizeTo: window,