diff --git a/src/lib/components/chat/ChatPlaceholder.svelte b/src/lib/components/chat/ChatPlaceholder.svelte
index 7fea74e2ba..8464224028 100644
--- a/src/lib/components/chat/ChatPlaceholder.svelte
+++ b/src/lib/components/chat/ChatPlaceholder.svelte
@@ -125,6 +125,7 @@
 
 		<div class=" w-full font-primary" in:fade={{ duration: 200, delay: 300 }}>
 			<Suggestions
+				className="grid grid-cols-2"
 				suggestionPrompts={models[selectedModelIdx]?.info?.meta?.suggestion_prompts ??
 					$config?.default_prompt_suggestions ??
 					[]}
diff --git a/src/lib/components/chat/Suggestions.svelte b/src/lib/components/chat/Suggestions.svelte
index a9a68a02f0..a73d796171 100644
--- a/src/lib/components/chat/Suggestions.svelte
+++ b/src/lib/components/chat/Suggestions.svelte
@@ -6,6 +6,7 @@
 	const dispatch = createEventDispatcher();
 
 	export let suggestionPrompts = [];
+	export let className = '';
 
 	let prompts = [];
 
@@ -21,7 +22,7 @@
 	</div>
 {/if}
 
-<div class=" h-40 max-h-full overflow-auto scrollbar-none">
+<div class=" h-40 max-h-full overflow-auto scrollbar-none {className}">
 	{#each prompts as prompt, promptIdx}
 		<button
 			class="flex flex-col flex-1 shrink-0 w-full justify-between px-3 py-2 rounded-xl bg-transparent hover:bg-black/5 dark:hover:bg-white/5 transition group"