diff --git a/app/ui/view/atom/button/button.tsx b/app/ui/view/atom/button/button.tsx
index c4cb7544..1d5de405 100644
--- a/app/ui/view/atom/button/button.tsx
+++ b/app/ui/view/atom/button/button.tsx
@@ -12,9 +12,9 @@ export function Button({ label, variant = 'primary', size = 'default', href, ...
   const ButtonVariants = cva(`flex justify-center items-center px-[6px] py-[1px]`, {
     variants: {
       variant: {
-        primary: 'bg-primary rounded-[100px] text-white border-0',
-        secondary: 'bg-white rounded-[100px] border-solid border-[1px] border-gray',
-        text: '',
+        primary: 'bg-primary rounded-[100px] text-white border-0 hover:bg-primary-hover',
+        secondary: 'bg-white rounded-[100px] border-solid border-[1px] border-gray hover:bg-white-hover',
+        text: 'font-medium text-slate-400 text-sm hover:text-slate-600',
         delete: 'py-[7px] px-[14px] bg-[#35353559] rounded-[7px] text-white leading-5 font-medium text-[18px]',
       },
       size: {
diff --git a/tailwind.config.ts b/tailwind.config.ts
index 0bc657b7..a300303b 100644
--- a/tailwind.config.ts
+++ b/tailwind.config.ts
@@ -15,9 +15,11 @@ const config: Config = {
       },
       colors: {
         primary: '#0B4093',
+        'primary-hover': '#093376',
         dark: '#002968',
         black: '#2f2f2f',
         gray: '#9f9f9f',
+        'white-hover': '#f3f4f6',
       },
     },
   },