diff --git a/packages/ui/src/components/primitives/combobox.tsx b/packages/ui/src/components/primitives/combobox.tsx
index 330a3d5e43..15afa8c0a8 100644
--- a/packages/ui/src/components/primitives/combobox.tsx
+++ b/packages/ui/src/components/primitives/combobox.tsx
@@ -18,7 +18,11 @@ import * as React from 'react'
 // ==================== Variants ====================
 
 const comboboxTriggerVariants = cva(
-  'inline-flex items-center justify-between rounded-2xs border-1 text-sm transition-colors outline-none font-normal bg-zinc-50 dark:bg-zinc-900',
+  cn(
+    'inline-flex items-center justify-between rounded-2xs border-1 text-sm transition-colors outline-none font-normal',
+    'bg-zinc-50 dark:bg-zinc-900',
+    'text-foreground'
+  ),
   {
     variants: {
       state: {
diff --git a/packages/ui/src/components/primitives/select.tsx b/packages/ui/src/components/primitives/select.tsx
index 31b5d5ce48..ec2bac4cba 100644
--- a/packages/ui/src/components/primitives/select.tsx
+++ b/packages/ui/src/components/primitives/select.tsx
@@ -5,15 +5,17 @@ import { CheckIcon, ChevronDownIcon, ChevronUpIcon } from 'lucide-react'
 import * as React from 'react'
 
 const selectTriggerVariants = cva(
-  'inline-flex items-center justify-between rounded-2xs border-1 text-sm transition-colors outline-none font-normal',
+  cn(
+    'inline-flex items-center justify-between rounded-2xs border-1 text-sm transition-colors outline-none font-normal',
+    'bg-zinc-50 dark:bg-zinc-900',
+    'text-foreground'
+  ),
   {
     variants: {
       state: {
-        default:
-          'bg-zinc-50 dark:bg-zinc-900 border-border aria-expanded:border-primary aria-expanded:ring-3 aria-expanded:ring-primary/20',
-        error:
-          'bg-zinc-50 dark:bg-zinc-900 border border-destructive! aria-expanded:ring-3 aria-expanded:ring-red-600/20',
-        disabled: 'opacity-50 cursor-not-allowed pointer-events-none bg-zinc-50 dark:bg-zinc-900'
+        default: 'border-border aria-expanded:border-primary aria-expanded:ring-3 aria-expanded:ring-primary/20',
+        error: 'border border-destructive! aria-expanded:ring-3 aria-expanded:ring-red-600/20',
+        disabled: 'opacity-50 cursor-not-allowed pointer-events-none'
       },
       size: {
         sm: 'px-3 gap-2 h-8',