diff --git a/src/lib/components/chat/MessageInput/Models.svelte b/src/lib/components/chat/MessageInput/Models.svelte
index b04a31ef7..b4bf97df9 100644
--- a/src/lib/components/chat/MessageInput/Models.svelte
+++ b/src/lib/components/chat/MessageInput/Models.svelte
@@ -139,12 +139,12 @@
 					<div class=" text-lg font-semibold mt-2">@</div>
 				</div>
 
-				<div class="max-h-60 flex flex-col w-full rounded-r-xl bg-white">
+				<div class="max-h-60 flex flex-col w-full rounded-r-xl bg-white dark:bg-gray-850">
 					<div class="m-1 overflow-y-auto p-1 rounded-r-xl space-y-0.5">
 						{#each filteredModels as model, modelIdx}
 							<button
 								class=" px-3 py-1.5 rounded-xl w-full text-left {modelIdx === selectedIdx
-									? ' bg-gray-100 selected-command-option-button'
+									? ' bg-gray-100 dark:bg-gray-600 selected-command-option-button'
 									: ''}"
 								type="button"
 								on:click={() => {
@@ -155,7 +155,7 @@
 								}}
 								on:focus={() => {}}
 							>
-								<div class=" font-medium text-black line-clamp-1">
+								<div class=" font-medium text-black dark:text-gray-100 line-clamp-1">
 									{model.name}
 								</div>