diff --git a/ui/components/EmptyChatMessageInput.tsx b/ui/components/EmptyChatMessageInput.tsx
index 3dd4db5..dd0e0d3 100644
--- a/ui/components/EmptyChatMessageInput.tsx
+++ b/ui/components/EmptyChatMessageInput.tsx
@@ -31,7 +31,7 @@ const EmptyChatMessageInput = ({
       }}
       className="w-full"
     >
-      <div className="flex flex-col bg-light-primary dark:bg-dark-primary px-5 pt-5 pb-2 rounded-lg w-full border border-light-300 dark:border-dark-200">
+      <div className="flex flex-col bg-light-primary dark:bg-dark-primary px-5 pt-5 pb-2 rounded-lg w-full border border-light-200 dark:border-dark-200">
         <TextareaAutosize
           value={message}
           onChange={(e) => setMessage(e.target.value)}
@@ -51,7 +51,7 @@ const EmptyChatMessageInput = ({
             />
             <button
               disabled={message.trim().length === 0}
-              className="bg-[#24A0ED] text-black dark:text-white disabled:text-black/50 dark:disabled:text-white/50 disabled:bg-[#e0e0dc] dark:disabled:bg-[#ececec21] hover:bg-opacity-85 transition duration-100 rounded-full p-2"
+              className="bg-[#24A0ED] text-white disabled:text-black/50 dark:disabled:text-white/50 disabled:bg-[#e0e0dc] dark:disabled:bg-[#ececec21] hover:bg-opacity-85 transition duration-100 rounded-full p-2"
             >
               <ArrowRight className="bg-background" size={17} />
             </button>
diff --git a/ui/components/MessageInput.tsx b/ui/components/MessageInput.tsx
index d215787..69bc021 100644
--- a/ui/components/MessageInput.tsx
+++ b/ui/components/MessageInput.tsx
@@ -40,7 +40,7 @@ const MessageInput = ({
         }
       }}
       className={cn(
-        'bg-light-primary dark:bg-dark-primary p-4 flex items-center overflow-hidden border border-light-300 dark:border-dark-200',
+        'bg-light-primary dark:bg-dark-primary p-4 flex items-center overflow-hidden border border-light-200 dark:border-dark-200',
         mode === 'multi' ? 'flex-col rounded-lg' : 'flex-row rounded-full',
       )}
     >
@@ -62,7 +62,7 @@ const MessageInput = ({
           />
           <button
             disabled={message.trim().length === 0 || loading}
-            className="bg-[#24A0ED] dark:text-white disabled:text-black/50 dark:disabled:text-white/50 hover:bg-opacity-85 transition duration-100 disabled:bg-[#e0e0dc] dark:disabled:bg-[#ececec21] rounded-full p-2"
+            className="bg-[#24A0ED] text-white disabled:text-black/50 dark:disabled:text-white/50 hover:bg-opacity-85 transition duration-100 disabled:bg-[#e0e0dc] dark:disabled:bg-[#ececec21] rounded-full p-2"
           >
             <ArrowUp className="bg-background" size={17} />
           </button>
@@ -78,7 +78,7 @@ const MessageInput = ({
             />
             <button
               disabled={message.trim().length === 0 || loading}
-              className="bg-[#24A0ED] dark:text-white text-black/50 dark:disabled:text-white/50 hover:bg-opacity-85 transition duration-100 disabled:bg-[#e0e0dc] dark:disabled:bg-[#ececec21] rounded-full p-2"
+              className="bg-[#24A0ED] text-white text-black/50 dark:disabled:text-white/50 hover:bg-opacity-85 transition duration-100 disabled:bg-[#e0e0dc] dark:disabled:bg-[#ececec21] rounded-full p-2"
             >
               <ArrowUp className="bg-background" size={17} />
             </button>
diff --git a/ui/components/Navbar.tsx b/ui/components/Navbar.tsx
index 2c0d87e..91e131f 100644
--- a/ui/components/Navbar.tsx
+++ b/ui/components/Navbar.tsx
@@ -38,7 +38,7 @@ const Navbar = ({ messages }: { messages: Message[] }) => {
   }, []);
 
   return (
-    <div className="fixed z-40 top-0 left-0 right-0 px-4 lg:pl-[104px] lg:pr-6 lg:px-8 flex flex-row items-center justify-between w-full py-4 text-sm text-black dark:text-white/70 border-b bg-light-primary dark:bg-dark-primary border-light-300 dark:border-dark-200">
+    <div className="fixed z-40 top-0 left-0 right-0 px-4 lg:pl-[104px] lg:pr-6 lg:px-8 flex flex-row items-center justify-between w-full py-4 text-sm text-black dark:text-white/70 border-b bg-light-primary dark:bg-dark-primary border-light-100 dark:border-dark-200">
       <Edit
         size={17}
         className="active:scale-95 transition duration-100 cursor-pointer lg:hidden"
diff --git a/ui/tailwind.config.ts b/ui/tailwind.config.ts
index fbfb42b..6d9066d 100644
--- a/ui/tailwind.config.ts
+++ b/ui/tailwind.config.ts
@@ -8,10 +8,10 @@ const themeDark = (colors: DefaultColors) => ({
 });
 
 const themeLight = (colors: DefaultColors) => ({
-  50: '#fff',
-  100: colors.slate[50],
-  200: colors.slate[100],
-  300: colors.slate[200],
+  50: '#fcfcf9',
+  100: '#f3f3ee',
+  200: '#ccccbe',
+  300: '#a4a692',
 });
 
 const config: Config = {