diff --git a/components/PreferencesModal.tsx b/components/PreferencesModal.tsx
index 88bf8a8..f2130bf 100644
--- a/components/PreferencesModal.tsx
+++ b/components/PreferencesModal.tsx
@@ -63,19 +63,19 @@ export const PreferencesModal: React.FC<PreferencesModalProps> = ({
         className="bg-white rounded-2xl max-w-lg w-full shadow-xl max-h-[90vh] overflow-hidden flex flex-col"
         onClick={(e) => e.stopPropagation()}
       >
-        <div className="p-6 border-b border-gray-100 flex items-center justify-between bg-gradient-to-r from-theme-primary to-purple-600">
-          <div className="flex items-center gap-3 text-white">
-            <div className="p-2 bg-white/20 rounded-xl">
+        <div className="p-6 border-b border-gray-100 flex items-center justify-between bg-white">
+          <div className="flex items-center gap-3 text-gray-900">
+            <div className="p-2 bg-gray-100 rounded-xl">
               <Palette size={24} />
             </div>
             <div>
               <h2 className="text-xl font-black">Color Scheme</h2>
-              <p className="text-sm opacity-80">Customize your theme</p>
+              <p className="text-sm text-gray-500">Customize your theme</p>
             </div>
           </div>
           <button
             onClick={handleClose}
-            className="p-2 hover:bg-white/20 rounded-xl transition text-white"
+            className="p-2 hover:bg-gray-100 rounded-xl transition text-gray-400 hover:text-gray-600"
           >
             <X size={24} />
           </button>